根据⽂件夹内图⽚⾃动⽣成html⽂件_使⽤了静态⽹页⽣成
器：从WordPress到
2020.10.6 增补：⼜换回了 Hugo，使⽤ Github 和 Netlify 托管，真⾹。
----- 以下是原⽂ ------
之前⽴过⼀个flag，说并不会把博客变为静态的，依然使⽤wordpress作为博客的主⼒。但是基于考试考完闲着蛋疼、⽆穷⽆尽折腾的原则，准备试试静态博客，也就是分别尝试了两个静态⽹页⽣成器：hexo和hugo。在使⽤两者之前就有将两者进⾏过对⽐，前者基于node.js、后者基于golang，在对⽐了种种优缺点之后决定还是选择wordpress 。不过还是对⽐出来⼀点东西的，个⼈倾向于hugo。
本⽂的⽬录（仅供参考之⽤，点了会跳转到原⽂）：
本⽂的⽬录
1. 尝试
2. 静态博客最快速上⼿
3. 安装 hugo
4. ⽤ hugo 创建第⼀个新⽹站
5. 给⽹站增加⼀点内容
1. 写第⼀篇⽂章
2. 或者复制粘贴你的 markdown ⽂件
6. 预览和上传站点
1. 上传并部署站点
1. 使⽤ FTP
2. 使⽤ Git
7. 杂项的配置
1. 内容摘要
2. 永久链接配置
3. 新建页⾯
4. 更改字体
5. 增加百度、⾕歌统计
6. 显⽰数学公式
7. 显⽰⽬录
8. 增补
尝试
但是，最明显的优点在于：hugo在构建过程中更快、hexo使⽤⼈数更多资源更丰富。作为新⼿的我，先⽤中⽂资源多的hexo搞了⼀遍，成功了之后换了⽆数套hexo主题没有太满意的，于是打算⾃⼰改⼀下主题。但是看到那些主题⽂件稍微有点懵，主题⽂件的后缀名千奇百怪：有些主题⽤了.ejs、有些主题⽤了.pug。
反正也很好查，pug就是jade⽂件——⼀种通过缩进的⽅式来编写代码的过程、可以和html相互转换。但是不巧的是，我那套主题把pug代码⽂本放到那种html转换器，并不能很好地转为html代码、直接修改这些⽂件⼜废眼睛（像在改⼀团乱码）。这种糟糕的体验很容易会使⼀个懒⼈放弃，于是我拿着⼀堆md⽂件正式投奔hugo的怀抱。
静态博客最快速上⼿
如果你有⼀个虚拟主机或者服务器，服务器搭建好了环境或者⾯板（⽐如：宝塔⾯板），那么你就可以在⾃⼰的本地电脑上⽣成⼀堆⽹页静态⽂件：⽐⽅说html、css、图⽚等等，然后⼀股脑地传到⾃⼰地虚拟主机上。绑定域名、解析域名、打开⽹址，⽹站建成了。
在上段所述过程中，最需要讲地就是“⽣成⼀堆⽹页静态⽂件”，本篇讲的就是这个步骤。有了这堆静态⽂件，⽹站=完成。
安装hugo
安装hugo可以直接点击hugo的快速⼊门，在windows中安装hugo。
我的环境是windows，选择的安装⽅法是Chocolatey (Windows)，步骤如下：
1. ⽤管理员⾝份打开windows中的Windows PowerShell（命令提⽰符）。（windows中搜索powershell，右键“⽤管理员⾝份运
⾏”）
2. 复制下⽅代码，然后执⾏
Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityPr
1. 输⼊choco，查看是否安装成功。
2. 复制下⽅代码，然后执⾏
choco install hugo -confirm
1. 安装完毕
⽤hugo创建第⼀个新⽹站
1. 这时候可以关闭powershell了，在想新建⽹站⽂件夹的路径下打开cmd，例如： C:Users⽤户名 。（路径随意，按照个⼈喜好决定）
2. 在cmd中，复制下⽅代码，然后执⾏（quickstart可以替换为⾃⼰的⽹站名，英⽂字母）
hugo new site quickstart
1. 上述操作会在 C:Users⽤户名 中创建⼀个名为"quickstart"的⽂件夹。打开这个⽂件夹会发现⼀些熟悉的⽬录，⽐⽅说theme⽬录⾥⾯
放的是主题、content⾥⾯放的就是markdown⽂件等等。
2. 下⼀步增加⼀个主题，这⾥推荐MemE主题，⾸先在CMD中打开博客所在⽂件夹：
cd /d C:Users⽤户名quickstart
先⽹上搜索git，安装⼀下（都选择默认选项）。然后在⽼地⽅CMD中输⼊：
git init
git submodule add github/reuixiy/hugo-theme-meme.git themes/meme
1. 替换l⽂件，即将这个链接的所有内容复制粘贴到 C:Users⽤户名quickstart ⽂件夹下的l⽂件中。（怎么打开奇怪
后缀名的⽂件？推荐使⽤notepad++或者visual studio code）
2. 配置l⽂件。对于MemE主题，该⽂件的配置说明极其详细，按照⽂件中说明修改即可。
给⽹站增加⼀点内容
写第⼀篇⽂章怎么创建自己的博客
1. 还是在⽼地⽅CMD中打开博客所在⽂件夹：
cd /d C:Users⽤户名quickstart
1. 输⼊下⽅代码，my-first-post可以修改成任意想要的内容，甚⾄中⽂：
hugo new posts/my-first-post.md
1. 在 content/posts ⾥到刚才新建的markdown⽂件，尽情写作吧。（什么是markdown？语法是什么？）在⽂章的开头（被称
为Front Matter，⽤于⽂章⽣成的⼀些控制）会⾃动⽣成下列部分字段，这⾥可以根据⾃⼰需要修改为：
---
title: "My First Post" #⽂章标题
description: ⽂章的描述信息
keywords:
- post
- blog
date: 2019-03-26T08:47:11+01:00 #⽂章建⽴时间
lastmod: 2019-03-26T08:47:11+01:00 #⽂章最近修改
draft: true #是否为草稿，false则不是草稿、会发布
slug: my-first-post #⽂章别名，⽤来做永久链接，下⽅会详细说明
tag: #⽂章的标签
- 第⼀个tag
- 第⼆个tag
-
第n个tag
categories: #⽂章的⽬录
- 第⼀个category
- 第⼆个category
- 第n个category
---
或者复制粘贴你的markdown⽂件
1. 将⾃⼰所有的markdown⽂件放⼊posts⽂件夹中即可。
2. 将原来wordpress中uploads的图⽚放⼊content⽂件夹下。
3. ⽤python批量将原有的图⽚链接替换为相对路径：完整代码下载，请点击这⾥，搜索⽂件名为20200126-
hugo_changes_urls_of_images.py的⽂件。
data = re.sub('d/wp-contents', '', data) # 修改此处代码，即将'd/wp-contents'替换为空。
if __name__ == '__main__':
top = r'C:Users⽤户名quickstartcontentposts' # 修改此处，更变为你的blog⽂件夹
modify_md_content(top)
预览和上传站点
输⼊命令hugo server 启动本地服务器（使⽤浏览器打开⽹址localhost:1313/即可预览），加上 -D 可以渲染 draft。
输⼊命令hugo ⽣成站点静态⽂件，⽣成的静态⽂件保存在public⽂件夹中。
上传并部署站点
安装宝塔⾯板（更⽅便管理）、环境；解析域名；绑定域名等操作可以查看这篇⽂章：⽹站⼜搬迁啦：顺便说⼀说使⽤腾讯云服务器搭建博
已安装宝塔⾯板、已在⾯板中添加完⽹站为前提。
客和wordpress备份迁移。下⽅的两条⽅法均以已安装宝塔⾯板、已在⾯板中添加完⽹站
2020.10.6 更新：推荐使⽤ Netlify !
使⽤FTP
上传站点先⽤个傻⼀点的办法：将public⽂件夹中的所有⽂件打包，这⾥推荐使⽤格式进⾏打包。之后可以通过宝塔⾯板或者ftp传⾄服务器，然后解压即可。（缺点：传输速度慢、速度慢、速度慢；但是每次可以不将uploads⽂件夹打包，图⽚单独传。）
使⽤Git
在github新建⼀个⾃⼰blog的仓库，并将⾃⼰博客⽂件下的所有内容上传⾄github，就像左边的链接那样。获取像这样的项⽬地址：github/0sheldonhuang0/hxdred_blog.git。
在服务器端（以CentOS为例）安装Git：
yum install git
在服务器端打开站点⽂件夹。在宝塔⾯板中，⼀般为/www/wwwroot/<；你设置的⽹站名称或⽂件夹>：
cd /www/wwwroot/<；你设置的⽹站名称或⽂件夹>
从github克隆或者拉取最新的内容，例如：
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论