欢迎光临散文网 会员登陆 & 注册

浅谈我用过的博客系统,以及Hugo的一些使用方法(本地构建+服务器部署)

2022-09-04 21:47 作者:Tiergff  | 我要投稿

  博客系统其实我用的不过,就两个:Wordpress 和 Typecho。Hugo是生成静态网页的工具,不算博客系统。

  只是搭建自己的小博客,直接盲选Typecho。Wordpress不需要的功能太多,而且占用也比较大。只是写博客嘛,Typecho功能够用了,各种功能的小插件,好多好看的主题,不就后台界面简单了点嘛,无伤大雅~  随时随地都能用手机登录后台写篇文章,这个巨方便啊!

  Hugo是我这几天尝试的新玩具,不用后台,不用数据库,本地搭建直接预览看效果,生成静态网页后直接上传到服务器,整个过程都非常方便。唯一不方便的就是不能在带薪上厕所时间用手机写篇发牢骚的小文章了。


  下面就简单说说Hugo吧,B站好像有不少视频教程了,貌似都是用的github?我手头有个服务器,不用不是浪费嘛。感觉Hugo生成的静态网页也可以传到虚拟主机里用,虚拟主机更便宜~  貌似现在还能放到阿里云和腾讯云的对象存储桶中,这个就更便宜了~

  这是用阿里云OSS部署静态网页的教程:

  https://blog.csdn.net/aliyunbaike/article/details/106047521

  如果域名没有备案,存储桶一定要选外边的呀!


  Hugo本地构建挺简单的,先在官方github上下载主程序,https://github.com/gohugoio/hugo/releases,下载自己系统对应的程序哈,我是Windows-64bit.zip。下载的压缩包解压到你能找到的文件夹,比如D:\hugo。然后在这个文件夹里新建一个bin文件夹,把解压出来的hugo.exe文件挪到bin文件夹里(D:\hugo\bin)。然后再到系统设置里把环境变量设置一下。

  后面开始用git进行命令行操作,下载地址:https://git-scm.com/download/win

  其实这部分直接看教程文档就行:https://www.gohugo.org/doc/overview/quickstart/

  

  Hugo最麻烦的在安装皮肤的部分,那场面堪比我买衣服~ (っ °Д °;)っ

  先在这里挑一个看的顺眼的主题:https://themes.gohugo.io/

  我的建议是先看主题介绍,如果下面简介特别长,又是插件又是扩展,代码还特别特别多的,这种的后面修改起来也很麻烦,能避还是避开吧,除非是特别特别喜欢这个主题,就要用它,非它不可。

  我是喜欢极简的,越简单越好,写几篇牢骚文章嘛,整那些花里胡哨的干啥。

  选好主题,点击download,会跳转到github的页面,这个github啊,不定时抽风,有时会打不开,多试几次没准就行了。

  先打开git,这玩意长得跟命令提示符差不多。用CD命令把路径弄到新建的站点里的themes文件夹,再用git clone 把主题下载到文件夹里。

  

  下载好的主题里一般会有个示例文件夹 exampleSite,把这里的东西都复制到站点根目录里。

  这个示例文件夹里会包含content文件夹(里面是文章模版),config.toml或config.yaml(全局设置文件),或许还会有static文件夹,里面是一些图标和js文件。

  第一步就是修改config.toml或config.yaml,title是网站名称,author是作者,paginate是页面显示文章数,不需要的功能就在前面加个#号给注释掉,有些功能是用true和false来打开关闭,嗯…… 每个主题情况不一样,具体情况具体分析吧。总体来说,主题越简洁,需要设置的东西也就越少,主题越复杂,需要设置的也多,出错也多。

  修改完config后,不急着添加文章,先在git里用hugo server命令让程序跑起来,因为有些主题特别容易出错…… hugo server启动成功后,打开浏览器,进入http://localhost:1313/,预览下效果还有各个功能是否正常,都没问题后,再往里面添加文章。

  主题哪里不合心意可以自己修改一下,比如页面都是英文,想改成中文可以到主题文件夹的layouts里修改,D:\hugo\sites\themes\hugo-theme-****\layouts,主要是修改这里面的html文件,比如页脚footer.html,页头header.html,主页index.html,全局baseof.html,文章页single.html。如果想添加一些短代码功能,也是在layouts文件夹里,新建shortcodes文件夹,把短代码的html放进去就OK了。

  最后文章也添加完成后,hugo server看着都没啥问题,就可以在git里用hugo命令生成静态网页了,生成的网站在public文件夹里。

  服务器那头很好弄,宝塔里新建网站,PHP那里选择静态,然后把public文件夹的东西都上传到 www/wwwroot/你的域名 里面,最后再设置好ssl就完成了。之后每次更新文章都要重新上传一遍。如果觉得每次都要登陆宝塔比较麻烦,也可以用ftp的方式上传文件。

  

  Hugo文章里插入图片,我是用的图片url外链方式,MD里的写法是:

  ![图片注释](图片url地址)

  Hugo文章里插入视频,我用的B站外链短代码,这个短代码教程网上一搜就有了。

  Hugo文章里插入音频,我还是用的url外链,写法:


  好像也没啥可写的了,Hugo部分就到这里吧~

浅谈我用过的博客系统,以及Hugo的一些使用方法(本地构建+服务器部署)的评论 (共 条)

分享到微博请遵守国家法律