1、next主题设置

主题设置

1、创建分类和标签

在站点文件夹下执行命令创建分类：

1	hexo n page categories

修改source\categories文件夹下index.md文件（必须要修改）

---
title: categories
date: 2022-05-29 23:44:15
type: categories
layout: categories
---

在站点文件夹执行命令创建标签：

1	hexo n page tags

修改source\categories文件夹下index.md文件(必须要修改)

---
title: tags
date: 2022-05-29 23:42:54
type: tags
layout: tags
---

2、本地搜索设置

首先在站点根目录，先安装hexo-generator-search插件，在进行配置

# Local search
# Dependencies: https://github.com/flashlab/hexo-generator-search
# 本地搜索，需要安装 hexo-generator-search
# 站点根目录执行：npm install hexo-generator-searchdb --save
local_search:
  enable: true
  search button
  # auto表示改变输入就自动触发搜索
  # manual表示按下回车键或搜索按钮才触发搜索
  trigger: auto
  # 这里的数字n表示显示每篇文章搜索到的n个结果
  # -1表示显示每篇文章搜索到的全部结果(不建议)
  top_n_per_article: 1

3、文章启用字数统计和阅读时长

在站点根目录安装hexo-wordcount插件

1	npm i --save hexo-wordcount

接下来进行配置

# Post wordcount display settings
# Dependencies: https://github.com/willin/hexo-wordcount
# 文章字数展示设置
post_wordcount:
  # 文本显示
  item_text: true
  # 文章字数统计
  wordcount: true
  # 阅读时长
  min2read: true
  # 站点总字数统计
  totalcount: false
  # 该post_wordcount的所有设置另起一行显示
  separated_meta: true

同时调整一下显示格式：
在themes/next/layout/_macro/post.swig中修改具体如下：
直接搜索post.wordcount、post.min2read

<span title="{{ __('post.wordcount') }}">
    {{ wordcount(post.content) }} 字
</span>

<span title="{{ __('post.min2read') }}" }}">
  {{ min2read(post.content) }} 分钟
</span>

4、设置左侧的头像显示

编辑主题的_config.yml，新增字段 avatar，值设置成头像的链接地址。

完整的互联网URL例如：https://avatars1.githubusercontent.com/u/32269?v=3&s=460

站点内的地址例如：
/uploads/avatar.jpg 需要将你的头像图片放置在站点的 source/uploads/（可能需要新建uploads目录）
/images/avatar.jpg 需要将你的头像图片放置在主题的 source/images/ 目录下。

具体配置如下(这里我用的是一个全的互联网地址)：

# Sidebar Avatar
# in theme directory(source/images): /images/avatar.jpg
# in site  directory(source/uploads): /uploads/avatar.jpg
avatar: https://avatars.githubusercontent.com/u/14095698?s=400&u=f11b97c018052a2af38bb56bbd81471c057003f4&v=4

5、设置社交和社交图标

# Social Links
# Key is the link label showing to end users.
# Value is the target link (E.g. GitHub: https://github.com/iissnan)
social:
  GitHub: https://github.com/zhongzunfa
  微信: https://www.yourname.com/weixin
  CSDN: https://blog.csdn.net/zhongzunfa


# Social Links Icons
# Icon Mapping:
#   Map a menu item to a specific FontAwesome icon name.
#   Key is the name of the item and value is the name of FontAwesome icon. Key is case-senstive.
#   When an globe mask icon presenting up means that the item has no mapping icon.
social_icons:
  enable: true
  # Icon Mappings.
  # KeyMapsToSocialItemKey: NameOfTheIconFromFontAwesome
  GitHub: github
  CSDN: leaf

注意点：在这个地址https://fontawesome.com/v5/cheatsheet 中的图标都可以，直接写上名称即可， 但是发现一个问题，有些写上还是不行具体的原因未知， csdn的就是，使用了自定义的，从地址上找的一个

6、设置打赏公共能：

# reward
reward_comment: 如果觉得我的文章对您有用，请随意打赏。您的支持将鼓励我继续创作！
wechatpay: /images/wechatpay.jpg
alipay: /images/alipay.jpg

将微信和支付宝的收款码, 放到images目录下

7、设置访问人数、总数等

首先找到如下位置：

# Show PV/UV of the website/page with busuanzi.
# Get more information on http://ibruce.info/2015/04/04/busuanzi/
busuanzi_count:
  # count values only if the other configs are false
  enable: true
  # custom uv span for the whole site
  site_uv: true
  site_uv_header: 访客数
  site_uv_footer: 人
  # custom pv span for the whole site
  site_pv: true
  site_pv_header: 总访问量
  site_pv_footer: 次
  # custom pv span for one page only
  page_pv: true
  page_pv_header: <i class="fa fa-file-o"></i> 阅读数
  page_pv_footer:

将enbale的配置项改成true, 同时修改对应的标题等，具体如上所示。
此外还需要修改不算子的地址, 找到/theme/next/layout/_scripts/_third-party/analytics/busuanzi-counter.swig文件

修改成下述地址

1	https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js

但是经过实验发现该js下载很慢，于是决定将js下载放在

注意点，在本地显示的是一个乱序的数字，发布后显示就正常了。

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

打开 themes/next/layout/_partials/footer.swig ,具体如下：

<div class="copyright" >
  {% set current = date(Date.now(), "YYYY") %}
  &copy; {% if theme.since and theme.since != current %} {{ theme.since }} - {% endif %}
  <span itemprop="copyrightYear">{{ current }}</span>
  <span class="with-love">
    <i class="fa fa-{{ theme.authoricon }}"></i>
  </span>
  <span class="author" itemprop="copyrightHolder">{{ config.author }}</span>
</div>

{% if theme.copyright %}
<div class="powered-by">
  {{ __('footer.powered', '<a class="theme-link" href="https://hexo.io">Hexo</a>') }}
</div>

<div class="theme-info">
  {{ __('footer.theme') }} -
  <a class="theme-link" href="https://github.com/iissnan/hexo-theme-next">
    NexT.{{ theme.scheme }}
  </a>
</div>

删除红框框住部分。

9、浏览页面显示当前浏览进度

编辑next主题下的_config.yml，搜索关键字scrollpercent将值改为 true。具体如下

1 2	# Scroll percent label in b2t button scrollpercent: true

10、分享功能

编辑next主题下的_config.yml，搜索关键字needmoreshare2 修改为下面设置，具体如下：

占时搁置。

11、配置首页显示摘要

1）写描述，如下所示:

---
title: zzf
date: 2022-06-05 12:16:32
tags:
description: 首次创建文章显示。
---

主要是加上了description这个值。
效果：

2）通过设置标签:
在需要进行显示阅读全文的地方写上more标签

效果