本文主要讲解博客的搭建过程，next主题优化，next配置文件详解等。
hexo+github的搭建过程2
准备安装软件
依次安装
配置和使用github
注册github
访问github.com右上角singnup
uername 最好都用小写，因为最后建立的博客地址是：http://username.github.io；邮箱十分重要，GitHub 上很多通知都是通过邮箱的。
创建Repository
Repository 名字应该是http://username.github.io。
其他的可以选择添加一些描述也可以选择默认什么也不添加 ，点击creat repository
配置SSH keys
运行git bash
$ ssh-keygen -t rsa -C "邮件地址@youremail.com"
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/your_user_directory/.ssh/id_rsa):<回车就好>
【提示1】这里的邮箱地址，输入注册 Github 的邮箱地址；
【提示2】「-C」的是大写的「C」
然后系统会要你输入密码：
Enter passphrase (empty for no passphrase):<设置密码>
Enter same passphrase again:<再次输入密码>
在回车中会提示你输入一个密码，这个密码会在你提交项目时使用，如果为空的话提交项目时则不用输入。这个设置是防止别人往你的项目里提交内容。
注意：输入密码的时候没有输入痕迹的，不要以为什么也没有输入。
添加SSH Key到GitHub
在本地文件夹找到id_rsa.pub文件，.ssh文件夹里记事本打开这个文件复制全部内容到github相应位。
测试
打开git bash，输入以下代码
$ ssh -T git@github.com
如何返回值中有successfully字段代表配置成功了。
设置用户信息
打开git bash，完善个人信息
$ git config --global user.name "user" //输入注册时的username
$ git config --global user.email "email" //填写注册邮箱
搭建hexo博客
利用npm命令安装hexo
$ npm install -g hexo
安装完成后，关掉前面那个 Git Bash 窗口。在本地创建一个与 Repository 中博客项目同名的文件夹（如E:\username.github.io）在文件夹上点击鼠标右键，选择 Git bash here；
【提示】在进行博客搭建工作时，每次使用命令都要在E:\username.github.io目录下。
执行下面的指令，Hexo 就会自动在 E:\username.github.io文件夹建立独立博客所需要的所有文件啦！
$ npm install hexo-deployer-git --save
现在已经搭建好本地的 Hexo 博客了，执行完下面的命令就可以到浏览器输入 localhost:4000 查看到啦
hexo g 每次进行相应改动都要hexo g 生成一下
hexo s 启动服务预览
执行完 hexo init 命令后会给一个默认的主题：landscape
你可以到官网找你喜欢的主题进行下载 hexo themes 知乎：有哪些好看的 Hexo 主题？
找到它所在的 Github Repository （怎么找，我喜欢的那个，恰好博主放了他的github地址）
找到之后通过git命令下载
在主题的repository点击clone 复制一下那个地址
$ git clone https://github.com/theme-next/hexo-theme-next themes/next
next主题使用及优化
启用主题
与所有 Hexo 主题启用的模式一样。 当 克隆/下载 完成后，打开 站点配置文件， 找到 theme 字段，并将其值更改为 next。
启用 NexT 主题
到此，NexT 主题安装完成。下一步我们将验证主题是否正确启用。在切换主题之后、验证之前， 我们最好使用 hexo clean 来清除 Hexo 的缓存。
选择 Scheme
Scheme 是 NexT 提供的一种特性，借助于 Scheme，NexT 为你提供多种不同的外观。同时，几乎所有的配置都可以 在 Scheme 之间共用。目前 NexT 支持三种 Scheme，他们是：
Muse - 默认 Scheme，这是 NexT 最初的版本，黑白主调，大量留白
Mist - Muse 的紧凑版本，整洁有序的单栏外观
Pisces - 双栏 Scheme，小家碧玉似的清新
Scheme 的切换通过更改 主题配置文件，搜索 scheme 关键字。 你会看到有三行 scheme 的配置，将你需用启用的 scheme 前面注释 # 去除即可。
选择 Pisces Scheme
#scheme: Muse
#scheme: Mist
scheme: Pisces
设置 语言
编辑 站点配置文件， 将 language 设置成你所需要的语言。建议明确设置你所需要的语言，例如选用简体中文，配置如下：
Local Search
添加百度/谷歌/本地 自定义站点内容搜索
安装 hexo-generator-searchdb，在站点的根目录下执行以下命令：
$ npm install hexo-generator-searchdb --save
search:
path: search.xml
field: post
format: html
limit: 10000
# Local search
local_search:
enable: true
文章模块的美化
文章内代码美化
行内代码
在主题目录下，将source/css/_custom/custom.styl文件修改如下：
//行内代码样式
code {
color: #ff7600;
background: #fbf7f8;
border: 1px solid #d6d6d6;
padding:1px 4px;
word-break: break-all;
border-radius:4px;
}
区块代码
在主题目录下，修改config.yml文件：
# 样式可选： normal | night | night eighties | night blue | night bright
highlight_theme: night
文章结束语
在主题目录下layout/_macro中新建 passage-end-tag.swig文件,并添加以下内容：
<div>
{% if not is_index %}
<div style="text-align:center;color: #ccc;font-size:14px;">
-------------本文结束<i class="fa fa-paw"></i>感谢您的阅读-------------
</div>
{% endif %}
</div>
在layout/_macro/post.swig文件中，找到：
{#####################}
{### END POST BODY ###}
{#####################}
在上面代码之前添加：
<div>
{% if not is_index %}
{% include 'passage-end-tag.swig' %}
{% endif %}
</div>
# 文章末尾添加“本文结束”标记
passage_end_tag:
enabled: true
增强文章底部版权信息
增加文章md文件的头部信息中添加copyright: true时，添加版权声明
在目录 next/layout/_macro/下添加 my-copyright.swig：
{% if page.copyright %}
<div class="my_post_copyright">
<script src="//cdn.bootcss.com/clipboard.js/1.5.10/clipboard.min.js"></script>
<!-- JS库 sweetalert 可修改路径 -->
<script src="https://cdn.bootcss.com/jquery/2.0.0/jquery.min.js"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<p><span>本文标题:</span><a href="{{ url_for(page.path) }}">{{ page.title }}</a></p>
<p><span>文章作者:</span><a href="/" title="访问 {{ theme.author }} 的个人博客">{{ theme.author }}</a></p>
<p><span>发布时间:</span>{{ page.date.format("YYYY年MM月DD日 - HH:MM") }}</p>
<p><span>最后更新:</span>{{ page.updated.format("YYYY年MM月DD日 - HH:MM") }}</p>
<p><span>原始链接:</span><a href="{{ url_for(page.path) }}" title="{{ page.title }}">{{ page.permalink }}</a>
<span class="copy-path" title="点击复制文章链接"><i class="fa fa-clipboard" data-clipboard-text="{{ page.permalink }}" aria-label="复制成功！"></i></span>
</p>
<p><span>许可协议:</span><i class="fa fa-creative-commons"></i> <a rel="license" href="https://creativecommons.org/licenses/by-nc-nd/4.0/" target="_blank" title="Attribution-NonCommercial-NoDerivatives 4.0 International (CC BY-NC-ND 4.0)">署名-非商业性使用-禁止演绎 4.0 国际</a> 转载请保留原文链接及作者。</p>
</div>
<script>
var clipboard = new Clipboard('.fa-clipboard');
$(".fa-clipboard").click(function(){
clipboard.on('success', function(){
swal({
title: "",
text: '复制成功',
icon: "success",
showConfirmButton: true
});
});
});
</script>
{% endif %}
在目录next/source/css/_common/components/post/下添加my-post-copyright.styl：
.my_post_copyright {
width: 85%;
max-width: 45em;
margin: 2.8em auto 0;
padding: 0.5em 1.0em;
border: 1px solid #d3d3d3;
font-size: 0.93rem;
line-height: 1.6em;
word-break: break-all;
background: rgba(255,255,255,0.4);
}
.my_post_copyright p{margin:0;}
.my_post_copyright span {
display: inline-block;
width: 5.2em;
color: #b5b5b5;
font-weight: bold;
}
.my_post_copyright .raw {
margin-left: 1em;
width: 5em;
}
.my_post_copyright a {
color: #808080;
border-bottom:0;
}
.my_post_copyright a:hover {
color: #a3d2a3;
text-decoration: underline;
}
.my_post_copyright:hover .fa-clipboard {
color: #000;
}
.my_post_copyright .post-url:hover {
font-weight: normal;
}
.my_post_copyright .copy-path {
margin-left: 1em;
width: 1em;
+mobile(){display:none;}
}
.my_post_copyright .copy-path:hover {
color: #808080;
cursor: pointer;
}
修改next/layout/_macro/post.swig，在代码
{#####################}
{### END POST BODY ###}
{#####################}
之前添加增加如下代码：
<div>
{% if not is_index %}
{% include 'my-copyright.swig' %}
{% endif %}
</div>
修改next/source/css/_common/components/post/post.styl文件，在最后一行增加代码：
@import "my-post-copyright"
保存重新生成即可。
参考
技术小白搭建hexo+github博客
next最新版主题下载使用
next主题官方文档
next主题个性化教程
next主题配置文件详解
NexT v6.0+ 背景动画Canvas_nest设置无效的解决方案
给Hexo搭建的博客增加百度谷歌搜索引擎验证
添加文章字数和读取文章的时间
hexo + next主题高级配置
