前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >简单使用 Hugo 博客

简单使用 Hugo 博客

作者头像
阿兵云原生
发布2023-10-19 15:58:28
2110
发布2023-10-19 15:58:28
举报
文章被收录于专栏:golang云原生newgolang云原生new

hugo

Hugo是一个用 Go语言 编写的静态网站生成器,可以快速地生成高效、安全和易于管理的静态网站。Hugo具有速度快、可定制性强、易于使用等特点,被广泛应用于个人博客、公司网站、文档站点等领域。

Hugo支持Markdown、HTML、CSS、JavaScript等标准文件格式并提供了多种主题、插件、模板等功能,使用户能够轻松地创建独特而具有吸引力的网站。同时,Hugo还支持多种语言和主流平台,满足不同用户的需求。

官网

安装快速指引

环境部署

  1. 下载 hugo_0.111.3_Linux-64bit.tar.gz
  2. 解压之后将可执行程序 hugo 放到 /usr/local/bin 下面
代码语言:javascript
复制
wget https://github.com/gohugoio/hugo/releases/download/v0.111.3/hugo_0.111.3_Linux-64bit.tar.gz
tar xvf hugo_0.111.3_Linux-64bit.tar.gz
cp hugo /usr/local/bin
hugo version

创建自己的 xxx.github.io

  1. 在 github 处创建仓库,命名为自己 github 的名字 + github.io

例如:qingconglaixueit.github.io

"账户名.github.io"

  1. 设置仓库公开,这样才能正常的访问到数据

创建站点

本次是使用 linux 的环境,可以在自己的任意目录下,创建自己的站点

代码语言:javascript
复制
hugo new site abing_blog

下载并应用主题

  1. 找到具体主题对应的 github 仓库,例如我下载的是 bootstrap4
  2. 下载仓库代码到 博客主目录下的 themes 下面
  • 例如当前已经在 abing_blog 下进行如下操作
代码语言:javascript
复制
# 例如当前已经在  abing_blog 下
cd themes
git clone git@github.com:alanorth/hugo-theme-bootstrap4-blog.git bootstrap4
cd ..
cp themes/bootstrap4/exampleSite/config.toml
cp themes/bootstrap4/content/post/* content/post/
  • 将 博客根目录下的 config.toml 中的 --baseUrl 修改成 自己的 博客地址,例如 https://qingconglaixueit.github.io/
代码语言:javascript
复制
vim config.toml

hugo --theme=bootstrap4 --baseUrl="https://qingconglaixueit.github.io/"'

  • 此时我们需要提交 public 目录下的内容到我们的 https://qingconglaixueit.github.io/ 仓库中
  • 初始化仓库 , 需要换成自己的 xxx.github.io
代码语言:javascript
复制
# 初始化仓库 , 如下需要换成自己的 xxx.github.io
git init

# 将所有内容添加到git
git add .

# 提交到git 本地
git commit -m "commit msg"

# 关联到远程git,注意这里需要写你自己的git 地址
git remote add origin https://github.com/qingconglaixueit/qingconglaixueit.github.io.git

# 推送到远程git
git push origin main

发布文章

  • 在博客根目录下执行
代码语言:javascript
复制
# 执行如下命令后,会在 博客 根目录下的 content/post 下生成具体的 md 文件,记得吧 md 中的 draft 设置为 false
hugo new post/xxx.md

# 编辑这个 md 成自己想要的内容

# 回到博客根目录下,渲染静态文件
hugo --theme=bootstrap4 --baseUrl="https://qingconglaixueit.github.io/"'

# 此时 到 public 目录下提交代码即可

可以查看地址:https://qingconglaixueit.github.io/ 看看效果

再细节一点的以及 hugo 详细命令等内容可以查看 hugo 中文文档 安装快速指引

自用的快捷方式分享

代码语言:javascript
复制
# 进入博客站点
alias inblog='cd /home/xmt/abing_blog/'

# 添加文章
alias addblog='_addblog(){ inblog; hugo new post/"$1";vim content/post/"$1";};_addblog'

# 渲染静态资源
alias hugoup='inblog; hugo --theme=bootstrap4 --baseUrl="https://qingconglaixueit.github.io/"'

# 提交 code
alias blogcmpush='inblog; cd public/ ;git add .;git commit -m "update article" ;git push ; cd ../ '

# 渲染并提交 code
alias hb='hugoup;blogcmpush'
本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2023-10-11,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 阿兵云原生 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 官网
  • 环境部署
  • 创建自己的 xxx.github.io
  • 创建站点
  • 下载并应用主题
  • 发布文章
  • 自用的快捷方式分享
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档