添加博客置顶
安装插件
$ npm uninstall hexo-generator-index --save $ npm install hexo-generator-index-pin-top --save
添加置顶开关
找到 /blog/source/scaffolds/post.md 添加
---
title: {{ title }}
date: {{ date }}
tags:
categories:
top: false
---
然后每次新建博客 hexo new"postname" 会显示页面
--- title: top: false date: tags: categories: ---
top: false 改成 true 就开启了文章置顶
设置置顶标志
打开 /themes/next/layout/_macro 目录下的post.swig文件，定位到 <div class="post-meta"> 标签下，插入如下代码：
{% if post.top %}
<i class="fa fa-thumb-tack"></i>
<font color=green>置顶</font>
<span class="post-meta-divider">|</span>
{% endif %}
就能在博客页头看到“置顶”标记了。
修改链接的默认格式
Hexo的永久链接的默认格式是 :year/:month/:day/:title/ 比如访问站点下某一篇文章时，其路径是 2018/04/12/xxxx/ 如果我们的文章标题是中文的，那么该路径就会出现中文字符。在路径中出现了中文字符很容易引发各种问题。
安装插件
在站点根目录执行命令：
$ npm install hexo-abbrlink --save
修改站点配置文件
打开根目录下的 _config.yml 文件，修改如下配置：
# permalink: :year/:month/:day/:title/ # permalink_defaults: permalink: posts/:abbrlink.html abbrlink: alg: crc32 # 算法：crc16(default) and crc32 rep: hex # 进制：dec(default) and hex
这里将页面都添加了 .html 的后缀，用来伪装成静态页面(虽说Hexo的页面本身就是静态页面)，这样可以直接从路径就知道这是个静态页面，方便seo。
接下来重新部署，可以看到文章路径变成了 /posts/xxxxx.html 就算我们将文字标题命名为中文也没问题了。
移动端页面调整
手机端网页左右留白太多，影响阅读体验，特别是看代码特费劲。
打开路径 /themes/source/css/_schemes/pisces/_layout.styl文件，把下面padding: 20px改小就好了，建议5或者0.
+tablet-mobile() {
border-radius: initial;
padding: 20px;
width: 100%;
修改阅读截断
在阅读一篇文章的时候，点开“阅读全文”的时候会截一段，这个感觉很突兀，俺很不喜欢。于是就改成点击阅读全文不截断。
打开文件 /themes/layout/_macro/post.swig找到post-button字头把里面的#more删除即可，如下：
<div class="post-button">
<a class="btn" href="{{ url_for(post.path) }}{%- if theme.scroll_to_more %}#more{%- endif %}" rel="contents">`
{{ __('post.read_more') }} »修改菜单栏字体
菜单栏字体太小，只有13px影响观感。
打开文件/themes/source/css/_common/outline/header/menu.styl,找到font-size字头把smaller修改为small或者medium.
small=14px medium=16px
修改Pisces主题文章分割线长度
更改主题路径下 /source/css/_common/components/post/post-eof.styl 中，把8%改大就可以了。
.post-eof {
background: $grey-light;
height: 1px;
margin: $post-eof-margin-top auto $post-eof-margin-bottom;
text-align: center;
width: 8%;修改版权信息
打开文件/themes/layout/_partials/post/post-copyright.swig，修改下面的字段，分别是作者，本文链接，版权声明。
<ul class="post-copyright">
<li class="post-copyright-author">
<strong>{{ __('post.copyright.author') + __('symbol.colon') }} </strong>{#
#}{{ post.author or author }}{#
#}</li> //作者信息
<li class="post-copyright-link">
<strong>{{ __('post.copyright.link') + __('symbol.colon') }}</strong>
{%- set postURL = post.url or post.permalink %}
{{ next_url(postURL, postURL, {title: post.title}) }}
</li> //本文链接
<li class="post-copyright-license">
<strong>{{ __('post.copyright.license_title') + __('symbol.colon') }} </strong>{#
#}{{ __('post.copyright.license_content', next_url(ccURL, ccIcon + ccText)) }}{#
#}</li> //版权声明
</ul>
</div>修改行内代码色块和字体颜色
找到/next/source/css/_variables/base.styl文件，找到Code & Code Blocks字段
$code-background = $gainsboro; #code-background是指色块颜色 $code-foreground = #fc6423; #code-foreground是指字体颜色
选择合适的色号，可参考下面网址：https://www.color-hex.com/
添加分享
安装share插件
$ npm install --save theme-next/hexo-next-share#last-release
添加Need More Share
以下添加在themes/_config.yml里即可:
Need More Share
needmoreshare:
enable: true
cdn:
js: //cdn.jsdelivr.net/gh/theme-next/theme-next-needmoreshare2@1/needsharebutton.min.js
css: //cdn.jsdelivr.net/gh/theme-next/theme-next-needmoreshare2@1/needsharebutton.min.css
postbottom:
enable: true
options:
iconStyle: box
boxForm: horizontal
position: bottomCenter
networks: Weibo,Wechat,Douban,QQZone,Twitter,Facebook
float:
enable: false
options:
iconStyle: box
boxForm: horizontal
position: middleRight
networks: Weibo,Wechat,Douban,QQZone,Twitter,Facebook
– END –
文章评论