Hexo-next主题优化篇

2021-04-23 20:29:59 阅读：443 来源： 互联网

标签：Hexo 配置文件优化主题 next 添加 https yourname com

注：下面说到的主题配置文件和站点配置文件分别在你的博客目录下的themes/next/_config.yml和_config.yml

1. 主题设定

next 集成了4种内置主题，可在主题配置文件中搜索scheme

# Schemes
scheme: Muse
#scheme: Mist
#scheme: Pisces
#scheme: Gemini

想使用那种主题去掉前面的#号即可，可自行尝试更换
每次更改完都需要执行hexo clean，hexo g, hexo s 即可在本地观察效果。

2. 设置语言

在站点配置文件中将language设置成为对应的语言

英文是en
简体中文是zh-CN

3. 设置菜单并添加页面

在主题配置文件中找到menu想添加什么页面去掉相应的注释即可

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

上面去掉哪行的注释就需要添加那个页面,执行下面的命令即可添加页面。

hexo n page tags
hexo n page categorie
hexo n page archives

4. 设置头像

在主题配置文件中搜索Avatar找到如下配置

avatar:
  # 图片的路径 如果是在本地的话 是以主题目录下source开始的 比如我的在themes/next/source/images/head2.jpg  
  url: /images/head2.jpg  
  # If true, the avatar will be dispalyed in circle.
  rounded: true
  # If true, the avatar will be rotated with the cursor.
  rotated: true

5. 添加侧边栏社交链接

在主题配置文件中搜索social找到你需要显示的社交链接,去掉注释,b并修改为你的链接。（#为注释）

social:
  GitHub: https://github.com/sudo-li || fab fa-github
  Gitee: https://gitee.com/sudo-li || fab fa-git
  #GitHub: https://github.com/yourname || github
  #E-Mail: mailto:yourname@gmail.com || envelope
  #Weibo: https://weibo.com/yourname || weibo
  #Google: https://plus.google.com/yourname || google
  #Twitter: https://twitter.com/yourname || twitter
  #FB Page: https://www.facebook.com/yourname || facebook
  #StackOverflow: https://stackoverflow.com/yourname || stack-overflow
  #YouTube: https://youtube.com/yourname || youtube
  #Instagram: https://instagram.com/yourname || instagram
  #Skype: skype:yourname?call|chat || skype
  #RSS: /atom.xml || rss

6. 添加友情链接

在主题配置文件中搜索links在Title后面添加你的友情链接

7. 开启文章打赏功能

在主题配置文件中搜索Reward 去掉前面相应的注释然后添加你的二维码路径路径同头像路径一样,是以主题目录下source开始的.

8. 添加fork github

在主题文件夹的layout下的——layout.wig 添加到<div class="headband"></div>这行代码的下面要添加的东西在https://tholman.com/github-corners/

9. 修改文章内连接样式

在/themes/next/source/css/_common/components/post.styl 最后添加如下代码

// 文章内链接文本样式
.post-body p a{
  color: #0593d3;
  border-bottom: none;
  border-bottom: 1px solid #0593d3;
  &:hover {
    color: #fc6423;
    border-bottom: none;
    border-bottom: 1px solid #fc6423;
  }
}

10. 修改文章标签的小图标

在http://www.fontawesome.com.cn/faicons/里找图标把图标的代码添加到 hemes/next/layout/_macro/post.swig下的tag.name 行

11. 添加评论系统

主题配置文件中找到Valine

valine:
  enable: true
  appid: SSB0Uv6SphdWF73z************ # Your leancloud application appid
  appkey: 1wlBhfILAIsNU********** # Your leancloud application appkey

enable 改为true
appid 和 appkey 可在https://www.leancloud.cn/这里获取
点击上面链接前往leancloud注册一个账号，然后随便注册一个应用
在设置中打开应用key，就可以找到appid和appkey，填入配置文件即可。

12. 添加搜索服务

在站点配置文件最后添加如下配置

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

然后在主题配置文件中开启

local_search:
  enable: true

标签：Hexo,配置文件,优化,主题,next,添加,https,yourname,com
来源： https://blog.csdn.net/liyunxuli/article/details/116069687

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9