从0到1搭建博客 - 安装Hexo

提示:推荐使用电脑浏览本文。

1. 本地准备:安装环境

1.1 安装Node.js

首先,我们需要给电脑安装Node环境。
进入Node.js官方网站,根据你的操作系统下载对应版本的安装包并执行安装即可。
点击进入: Node.js官方下载地址

1.2 安装Git

1.3 安装Hexo

1.4 配置Hexo

2. 远程准备

2.1 注册GitHub

2.2 新建仓库

3. 正式发布

  • 模板配置

常用命令

开启服务,使hexo可通过浏览器访问

1
hexo s

生成并部署到Github

1
hexo d -g

阅读全文

在文章中使用 <!–more–> 标签隔开上下文,标签后的内容将被隐藏,需要点击“阅读全文”后才可查看。

1
2
3
4
5
标签前为可以在首页显示的内容

<!--more-->

标签后为隐藏的内容,需点击阅读全文才可查看

添加分类

执行命令:

1
hexo new page categories

执行后会在source目录中生成一个名为categories的文件夹。

进入source/categories文件夹,编辑名为index.md的文件。

在文件中添加一行 type: “categories”,如下所示:

1
2
3
4
5
---
title: categories
date: 2019-02-01 10:44:12
type: "categories"
---

添加标签

执行命令:

1
hexo new page tags

执行后会在source目录中生成一个名为tags的文件夹。

进入source/tags文件夹,编辑名为index.md的文件。

在文件中添加一行 type: “tags”,如下所示:

1
2
3
4
5
---
title: tags
date: 2019-02-01 10:47:28
type: "tags"
---

菜单图标

菜单图标来自
fontawesome

可以进入网站挑选自己喜欢的图标

底部通用版权设置

底部隐藏“由Hexo强力驱动”、“主题–NexT.Mist”

打开 themes/next/layout/_partials/footer.swig,注释或编辑相应代码

注释:

1
2
3
4
5
<!--
{% if theme.footer.powered %}
...
{% endif %}
-->

添加站点地图

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

安装插件
打开hexo目录下的dos命令行,分别安装百度和google插件

1
2
npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save

在博客目录的_config.yml中添加如下代码

1
2
3
4
5
# 自动生成sitemap
sitemap:
path: sitemap.xml
baidusitemap:
path: baidusitemap.xml

编译你的博客
hexo g

如果你在你的博客根目录的public下面发现生成了sitemap.xml以及baidusitemap.xml就表示成功了!

首页title的优化

更改index.swig文件,文件路径是your-hexo-site\themes\next\layout,将下面代码

1
{% block title %}  {{ config.title }}  {% endblock %}

改成

1
{% block title %}  {{ config.title }} - {{ theme.description }}  {% endblock %}