0%

NexT主题相关设置

github地址:https://github.com/theme-next/hexo-theme-next

文档地址:http://theme-next.iissnan.com/

“\themes\next”下的_config.yml称为主题配置文件,站点总目录下的__config.yml称为站点配置文件

选择NexT中的不同主题

主题配置文件中搜索“scheme”,把相应主题去除注释即可

1
2
3
4
5
# Schemes
#scheme: Muse
scheme: Mist
#scheme: Pisces
#scheme: Gemini

增加菜单栏

  1. 主题配置文件中搜索“menu”,去除相应注释即可
1
2
3
4
5
6
7
8
9
menu:
home: / || home
about: /about/ || user
tags: /tags/ || tags
categories: /categories/ || th
archives: /archives/ || archive
#schedule: /schedule/ || calendar
#sitemap: /sitemap.xml || sitemap
#commonweal: /404/ || heartbeat
  1. 写文章时头部带上标签和分类,文章就会显示在相应menu下
1
2
3
4
title: next主题相关设置
date: 2020-01-20 13:26:42
tags: [标签1,标签2] #标签
categories: 其他 #分类
  1. 可直接修改“\scaffolds\posts.md”,这样下次新建文章就会生成这两个
1
2
3
4
title: {{ title }}
date: {{ date }}
tags:
categories:

隐藏网页底部powered By Hexo / 强力驱动

打开 themes/next/layout/_partials/footer.swig,删除以下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
{% if theme.footer.powered.enable %}
<div class="powered-by">{#
#}{{ __('footer.powered', '<a class="theme-link" target="_blank"' + nofollow + ' href="https://hexo.io">Hexo</a>') }}{% if theme.footer.powered.version %} v{{ hexo_env('version') }}{% endif %}{#
#}</div>
{% endif %}

{% if theme.footer.powered.enable and theme.footer.theme.enable %}
<span class="post-meta-divider">|</span>
{% endif %}

{% if theme.footer.theme.enable %}
<div class="theme-info">{#
#}{{ __('footer.theme') }} – {#
#}<a class="theme-link" target="_blank"{{ nofollow }} href="https://theme-next.org">{#
#}NexT.{{ theme.scheme }}{#
#}</a>{% if theme.footer.theme.version %} v{{ version }}{% endif %}{#
#}</div>
{% endif %}

浏览页面显示当前进度

打开 themes/next/_config.yml,搜索关键字 scrollpercent,把 false 改为 true

Local Search本地搜索

  1. 站点根目录下执行以下命令
1
npm install hexo-generator-searchdb --save
  1. 站点配置文件中新增以下内容到任意位置
1
2
3
4
5
search:
path: search.xml
field: post
format: html
limit: 10000
  1. 编辑主题配置文件,启用本地搜索
1
2
3
# Local search
local_search:
enable: true

设置个人头像

主题配置文件中设置以下内容

1
2
3
4
5
6
7
8
9
10
11
12
# Sidebar Avatar
avatar:
# in theme directory(source/images): /images/avatar.gif
# in site directory(source/uploads): /uploads/avatar.gif
# You can also use other linking images.
url: #/images/avatar.jpg
# If true, the avatar would be dispalyed in circle.
rounded: false
# The value of opacity should be choose from 0 to 1 to set the opacity of the avatar.
opacity: 1
# If true, the avatar would be rotated with the cursor.
rotated: false

设置站点建立时间

主题配置文件中搜索“since”并修改值

1
since: 2020

设置网站图标

EasyIcon 中找一张(32*32)的 ico 图标,或者去别的网站下载或者制作,并将图标名称改为favicon.ico,然后把图标放在 /themes/next/source/images 里,并且修改主题配置文件:

1
2
# Put your favicon.ico into `hexo-site/source/` directory.
favicon: /favicon.ico

网站底部字数统计

切换到根目录下,运行如下代码:

1
Copynpm install hexo-wordcount --save

然后在 /themes/next/layout/_partials/footer.swig 文件尾部加上:

1
2
3
4
Copy<div class="theme-info">
<div class="powered-by"></div>
<span class="post-count">博客全站共{{ totalcount(site) }}字</span>
</div>

显示中文

站点配置文件中修改

1
language: zh-CN

添加访问统计

主题访问配置修改

1
2
3
4
5
6
7
8
busuanzi_count:
enable: true
total_visitors: true
total_visitors_icon: user
total_views: true
total_views_icon: eye
post_views: true
post_views_icon: eye

侧边栏相关设置

主题配置文件搜索“sidebar”

首页显示文章摘要

通过Hexo提供的方式,手动添加<!– more –> 进行分割

1
2
3
摘要摘要
<!-- more -->
详细内容

集成gitalk评论系统

最新的NexT主题只需在站点配置文件下进行配置

  1. 在github上注册应用

注册github应用

  1. 主题配置文件中找到gitalk
1
2
3
4
5
6
7
8
9
10
11
12
gitalk:
enable: true #开启
github_id: github的id # GitHub repo owner
repo: 用于存放评论的仓库名,可以新建一个仓库 # Repository name to store issues
client_id: 刚才注册完提供的 # GitHub Application Client ID
client_secret: 刚才注册完提供的 # GitHub Application Client Secret
admin_user: github的用户名 # GitHub repo owner and collaborators, only these guys can initialize gitHub issues
distraction_free_mode: true # Facebook-like distraction free mode
# Gitalk's display language depends on user's browser or system environment
# If you want everyone visiting your site to see a uniform language, you can set a force language value
# Available values: en | es-ES | fr | ru | zh-CN | zh-TW
language: zh-CN #中文
  1. 重新生成部署