前言

已经很久没写博客了。不得不说，折腾真的很消耗人的热情。当初我也是充满热情的建立网站，但是因为我只有一台电脑有时工作需要在windows下，我的网站又是在linux下，频繁的切换系统太麻烦了，搬迁网站我想想也觉得也很麻烦。所以，我停下了。

写博客之前也需要稍微考虑全面一点，要想好这个博客是记录什么？分享什么？说实话当初写的博客全是记录技术方面的东西，显得即枯燥又无聊，再次回看的时候发现我已经不懂其中写的一些东西了。

我的博客，我却连标签与分类的作用都没有好好的思考，导致打得标签种类和分类差不多，网站结构冗余！没有好好用心运作，有点惭愧。

我买的域名到期了，再次续费很贵，所以我再次把网站搬上了github，也省去了其他的麻烦。

这次重新燃起了热情，希望我能坚持下去。

重启网站

得益于之前写的一键部署脚本deploy.sh，以及博客的原始文件保存在github上，我才能快速完成搬迁。

首先做的第一件事就是重新安装hugo。

安装完成之后把github上的CNAME文件删除（我买的域名失效了，所以这个文件也没用了），确保本地的源文件和github上一致，同时在github仓库的设置里面把Custom domain删除。

最后再运行之前写好的deploy.sh脚本就可以重新上线网站啦～

网站添加About页面

使用hugo命令：

1

hugo new about.md

新建了一个about.md文件在post同级目录下。

此时我们需要修改一下about.md里面的一些内容，让它能出现在菜单栏的按钮中。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18

# 原始about.md
---
title: "关于"
date: 2020-02-02T16:23:32+08:00
draft: true
---

# 修改后的about.md
---
title: "关于"
date: 2020-02-02T16:23:32+08:00
menu: "main"
weight: 60
comment: false
---
这是一个测试

# menu让它出现在菜单栏，weight控制它在菜单栏的前后位置，comment控制此页面能否评论

这样好了之后，再次运行deploy.sh之后等几分钟就能在网站上看到新加的“about”页面啦。

同理，我们也可以通过这种方式给自己的网站加入其他页面。

我把tiddlywiki整合进我的网站也是用的这种方法。

把tiddlywiki整合到菜单栏

如果你不知道tiddlywiki那也没关系，详细内容你可以到tiddlywiki中文官网查看，现在只要知道它是一个html文件就行了。

为了实现这个效果，我们首先重复一下之前的步骤

1

hugo new wiki.md

同时按照about.md的格式修改，但是不要添加实际的内容，因为后面会被替换掉。

我们运行一下deploy.sh，然后可以看到博客文件夹下的public里面多了一个wiki文件夹，同时我们看到里面有个index.html文件。

我们没法在public文件夹里修改或者替换index.html来达到修改网站样式的目的，因为这些是hugo生成的。对这里面的内容修改之后只要再运行hugo，所有内容就会被重新覆盖。

一个用hugo生成的网站包含以下文件和文件夹：

  • archetypes: 储存.md的模板文件，该文件夹的优先级高于主题下的/archetypes文件夹
  • config.toml: 配置文件
  • content: 储存网站的所有内容
  • data: 储存数据文件供模板调用
  • layouts: 储存.html模板，该文件夹的优先级高于主题下的/layouts文件夹
  • static: 储存图片,css,js等静态文件，该目录下的文件会直接拷贝到/public，该文件夹的优先级高于主题下的/static文件夹
  • themes: 储存主题
  • public: 执行hugo命令后，储存生成的静态文件

可以看到static这个文件夹有一个特性就是可以将里面的文件复制到public文件夹里面。我们可以将我们自定义的页面放到这个目录下，因为它不是hugo生成的，所以不会被覆盖。

为了将网站上的wiki菜单栏按钮连接到tiddlywiki页面，我们在static文件夹下面新建一个和public文件夹中一样的wiki文件夹，然后我们把保存的tiddlywiki.html命名为index.html放到static的wiki文件夹下面。

这样，public下面的wiki文件夹就会被static中的wiki文件夹替换掉，wiki页面会和tiddlywiki.html连接起来。当我们点击网站下的wiki菜单按钮就会跳到wiki页面啦！

参考

hugo介绍及使用

Hugo 从入门到会用