个人博客，在我的心中，就像一个家一样，它像是我心灵的避港湾。博客里面的文章是构成我家的主要部分，我选择的next主题是家的装饰，来我博客参观的你们，就是远道而来的贵客。

• 主要插件

我很喜欢这样的想法，所以才会那么认真的对待我的家🏠，耗费许多心血、精力、时间，去完善它。

相信，它不会让我失望的。

让我为你点一首歌吧！
♪一直陪着你ヾ(·▽·ヾ)
开始静静享受歌曲吧！

可以看到，我目前用的next主题是v6.7.0，也许以后还会换，目前就记下我常用的一些装点方法吧！如果也对你有用，那就更好了。

此文主要记录一下我使用的插件

next有些功能是需要安装插件的，所以，还是要看懂英文注释，然后去相应的网站下载即可。

相关文章

命令^r

1

npm install hexo-related-popular-posts --save

注脚

plugins:

• hexo-footnotes

似乎有bug，就是[<sup>1]:一定要放在[</sup>1]后面，要不然显示不了。

分享NeedMoreShare2 for NexT

Step 1 → Go to NexT dir到next主题的根目录^n（而不是hexo哦）
Change dir to NexT directory. There must be layout, source, languages and other directories:

1
2
3

$ cd themes/next
$ ls
bower.json  _config.yml  docs  gulpfile.coffee  languages  layout  LICENSE.md  package.json  README.md  scripts  source  test

Step 2 → Get module安装模块
Install module to source/lib directory:

1

$ git clone https://github.com/theme-next/theme-next-needmoreshare2 source/lib/needsharebutton

Step 3 → Set it up
Enable module in NexT _config.yml file:到next主题配置文件中设置好以下代码：

1
2
3
4
5
6

needmoreshare2:
  enable: true
  postbottom:
    enable: true
  float:
    enable: true

Update

1
2

$ cd themes/next/source/lib/needsharebutton
$ git pull

部署到gutbub上hexo-deployer-git

需要安装插件后，就可以部署到github上，对于像我一样没有买域名的，也就可以把代码存到github上了。

安装插件

在博客根目录，使用命令npm install hexo-deployer-git --save，即可安装插件

配置

在站点_config.yml配置中，deploy 的type使用git，而不是github

1
2
3
4

deploy
     type: git
     repository: git@github.com:YOUR_ID/YOUR_ID.github.io.git
     branch: master

使用方法

当我们用了hexo g生成静态博客、hexo s在当地可浏览网页页面后无误，觉得可以了，那就使用hexo d把生成的文件部署到github上保存，就好咯。

hexo d是hexo deploy的简写

实现博客订阅功能generator-feed

Leave rss as empty to use site’s feed link, and install hexo-generator-feed^feed: npm install hexo-generator-feed --save.

即cd blog在blog文件夹内，输入并且回车终端命令npm install hexo-generator-feed --save进行安装。

然后在配置文件中输入代码：

1
2
3
4
5
6
7
8
9
10

feed:
  type: atom
  path: atom.xml
  limit: 20
  hub:
  content:
  content_limit: 140
  content_limit_delim: ' '
  order_by: -date
  icon: icon.png

统计字数与阅读时长hexo-symbols-count-time

https://github.com/theme-next/hexo-symbols-count-time

npm install hexo-symbols-count-time –save

本地搜索searchdb

https://github.com/theme-next/hexo-generator-searchdb

安装命令

1
2

npm install hexo-generator-searchdb --save
npm install hexo-generator-search --save

修改站点配置文件：在站点配置文件中，添加下面的配置信息:

1
2
3
4
5

search:
    path: search.xml
    field: post
    format: html
    limit: 10000

修改Next主题配置文件：找到local_search配置项，把enable改为true即可。

1
2

local_search:
    enable: true

markdown增强：hexo-renderer-markdown-it-plus

安装

使用命令^markdown

npm un hexo-renderer-marked –save
npm i hexo-renderer-markdown-it-plus –save

站点配置

在站点配置中任意空白处加入这些代码：

1
2
3
4
5
6
7
8
9
10

markdown_it_plus:
    highlight: true
    html: true
    xhtmlOut: true
    breaks: true
    langPrefix:
    linkify: true
    typographer:
    quotes: “”‘’
    pre_class: highlight

高级功能：关闭一些不想用的插件

因为这个插件是默认安装了很多其他的插件

1
2
3
4
5
6
7
8
9
10
11

markdown-it-emoji
markdown-it-sub
markdown-it-sup
markdown-it-deflist
markdown-it-abbr
markdown-it-footnote
markdown-it-ins
markdown-it-mark
@iktakahiro/markdown-it-katex
markdown-it-toc-and-anchor

所以，你可以选择性的关闭

高级功能：安装其他插件

Add other markdown-it Plugins
If you want to add a plugin named as markdown-it-something:

1. Install this plugin；使用以下代码命令安装插件

1

npm install markdown-it-something --save

2. config main hexo _config.yml；在站点配置文件中自定义配置

1
2
3
4
5
6
7
8

markdown_it_plus:
    # ...
    plugins:
        - plugin:
            name: markdown-it-something
            enable: true
            options:
                # this is plugin option

主要特性&常用Markdown语言

• Support for Markdown
• Extensive configuration
• Faster than the default renderer | hexo-renderer-marked
• sub, 下标：H<sub>2</sub>0 H₂0
• sup, 上标：x<sup>2</sup> x^2
• ins, 插入下划线：++Inserted++ ++Inserted++, <sub></sub>Del<sub></sub> Del
• Katex, 数学公式[^{math]：$\sqrt{3x-1}+(1+x)}2$</sup>
• emoji, 表情：
• toc&anchor 目录：@[toc]
• deflist
• abbr 缩写：*[HTML]: Hyper Text Markup Language
• footnote 页脚、脚注：[<sup>1] [</sup>1]:
• mark 标记：==marked== => <mark>inserted</mark> ==marked== => inserted

jquery-backstretch

安装

Installation

1. Download/save the JS file from GitHub.先在github下载此代码（https://github.com/jquery-backstretch/jquery-backstretch）
2. 安装bower，因为下面要用bower命令安装jquery-backstretch
3. Install via Bower with the following command.用下面的命令安装jquery-backstretch

   1	bower install jquery-backstretch

报错1

我没有想到，在这里用了一个代码$\sqrt{3x-1}+(1+x)^2$，然后我的页面宽度极具扩大！本来博客页面只有上下滚动的嘛，后来，因为宽度扩大，导致我的页面还可以左右动，非常宽。真是bug

虽然目前不常用数学公式，但是未必未来不用，毕竟理科生，latex、katex可能未来还是要用到的，如果在博客用这些公式出现了差错，就有迹可循了。因为我把这个代码放到了无序列表中一项内容的后面，然后sqrt这个根的上部分就一直..一直…..往右..延长……

所以，以后要检查、排除一下差错，不要放到无序列表，或者，背景用的代码加上一句width:xxxxxpx
{ width: 1080, url: "path/to/image1_1080.jpg" }