你难道不想搭建自己的个人博客吗？

这是之前自己搭建个人博客的过程，基于 GitHub Pages + Hexo 搭建，分享给大家。有什么问题可以直接留言。

1、安装 node.js

node.js: https://nodejs.org/en/

2、安装 Git

Git: https://git-scm.com/downloads

3、安装 Hexo

在文件夹中建立名为 hexo 的文件夹，右键打开 Git Bush，使用 npm 安装 Hexo。

npm install -g hexo-cli

初始化 blog， Hexo 自动在 blog 文件夹下创建网站所需文件。

hexo init blog

进入 blog 文件夹，安装依赖包。

cd blog npm install

生成静态页面

hexo g # 或 hexo generate

启动本地 web 服务

hexo s # 或 hexo server

此时在浏览器地址栏中键入 http://localhost:4000/ ， 可以看到内置的页面。

4、GitHub Pages 设置

注册 GitHub 及其使用可以参考 从 0 开始学习 GITHUB 系列汇总

http://stormzhang.com/github/2016/06/19/learn-github-from-zero-summary/

在 GitHub 上创建仓库，而且仓库的名字格式为： username.github.io，username 与 GitHub 账号名对应，每个帐号只能有一个仓库来存放个人主页。可以通过 http://username.github.io 来访问个人主页。

5、部署 Hexo 到 GitHub Pages

其实就是将 Hexo 生成的静态页面提交 (git commit) 到 GitHub 上。

在 Hexo 根目录下的配置文件 _config.yml 中进行修改:

deploy: type: git repo: git@github.com:zywudev/zywudev.github.io.git branch: master

还得安装一个扩展

npm install hexo-deployer-git --save

然后在命令行部署

hexo d

6、Hexo 主题基本配置

选择喜欢的主题。Hexo 官网主题。我的博客选用的是 NexT 主题，官方提供了详细的使用文档。

下载 NexT 主题

git clone https://github.com/iissnan/hexo-theme-next themes/next

启用 NexT 主题

克隆完成后，打开站点配置文件 __config.yml，找到 theme 字段，修改为：

theme: next

站点配置文件：博客目录下的 __config.yml 文件。

主题配置文件： themes/next 目录下的 __config.yml 文件。

启动本地 web 服务验证

hexo s --debug

至此，即完成了基于 GitHub Pages + Hexo 的个人博客框架搭建。

7、博客推广

将个人博客推广到 Google 搜索引擎上。

验证网站

推荐文件验证。

下载 HTML 验证文件，将该文件放到博客 source 目录下。

hexo 编译文件时，会给下载的 HTML 文件中添加其他的内容，导致验证失败，所以需要在文件开头添加 layout: false 来取消 hexo 对其进行的转换。

layout: false --- google-site-verification: googleb6fc53a32f5418d9.html

部署到 GitHub，输入https://zywudev.github.io/googleb6fc53a32f5418d9.html ， 能访问即可点击验证按钮进行验证。

站点地图

站点地图是一种文件，您可以通过该文件列出您网站上的网页，从而将您网站内容的组织架构告知 Google 和其他搜索引擎。Google 等搜索引擎网页抓取工具会读取此文件，以便更加智能地抓取您的网站。

使用 hexo-generator-sitemap 插件来生成 Sitemap，执行

npm install hexo-generator-sitemap --save

执行

hexo g

博客根目录的public下面生成了 sitemap.xml 。如果没有，在博客目录的 _config.yml 中添加如下代码重新编译

sitemap: path: sitemap.xml

要将博客目录 __config.yml 中的 url 字段设置为自己的域名

url: http://zywudev.github.io

部署到 Github，访问 https://zywudev.github.io/sitemap.xml。

提交 sitemap 到 Google站长工具，找到添加站点地图按钮，添加 sitemap.xml 即可，如下图。

8、博客优化

添加 about 页面

hexo new page "about"

在 sourceabout 目录下会生成一个 index.md 文件,添加个人信息即可。

添加分类、标签页面

hexo new page "categories" hexo new page "tags"

博客标题、作者等

打开站点配置文件

title: Wu's blog subtitle: description: O ever youthful,O ever weeping author: Wu language: zh-Hans timezone:

修改文章内文本链接样式

将文本链接设置为蓝色，修改 themes extsourcecss_commoncomponentspostpost.styl,添加

.post-body p a{ color: #0593d3; border-bottom: none; &:hover { color: #0477ab; text-decoration: underline; } }

修改博客 logo

通过网站 favicon在线制作 网站制作 favicon 图片。

将图片放在博客 source 目录下即可。

添加 Fork me on GitHub 挂件

在官网选取样式。

拷贝代码，修改 href 地址为自己的 GitHub 地址

 改为： 

修改文件: themes/next/layout/_layout.swig，将代码拷贝至对应位置。

 {% include '_scripts/third-party/analytics.swig' %}      
  {%- include '_partials/header.swig' %}