hexo博客next7.8主题配置

最新推荐文章于 2024-07-14 08:30:37 发布

「已注销」

最新推荐文章于 2024-07-14 08:30:37 发布

阅读量516

点赞数 2

文章标签： html

本文链接：https://blog.csdn.net/qq_23257753/article/details/115720606

版权

本文介绍了如何配置Hexo博客Next7.8主题，包括修改标签样式、设置侧边栏社交链接、标签云和网易云音乐、动态背景、彩色标签页以及归档页美化。详细步骤涉及修改特定的SWIG文件、配置YAML文件和添加CSS样式。同时，还展示了如何添加歌单播放器，使用hexo-tag-aplayer插件。

摘要由CSDN通过智能技术生成

Next版本： 7.8.0

hexo版本: 5.4.0

next查看版本： 打开next主题目录下的package.json 

  "name": "hexo-theme-next",
  "version": "7.8.0",
  "description": "Elegant and powerful theme for Hexo.",
  "main": "gulpfile.js",

Next主题-修改标签样式

🤫修改/themes/next/layout/_macro/post.swig 将’’#’'修改为fa fa-tag

{`%`- if theme.tag_icon %}`
    `{%- set tag_indicate = '<i class="fa fa-tag"></i>' %}`
  `{% else %}`
    `{%- set tag_indicate = '<i class="fa fa-tag"></i>' %} # 改这里`
  {%- endif %}`

侧边栏社交链接

🤫修改 themes\next_config.yml主题配置文件

social:
  #GitHub: https://github.com/yourname || fab fa-github
  QQ: http://wpa.qq.com/msgrd?v=3&uin=*******&site=qq&menu=yes || fab fa-qq
  微博: https://weibo.com/u/****** || fab fa-weibo
  #Google: https://plus.google.com/yourname || fab fa-google
  #Twitter: https://twitter.com/yourname || fab fa-twitter

social_icons:
  enable: true
  #icons_only: false
  #transition: false
###设置友情链接
links_settings:
  icon: fa fa-link #图标
  title: 友情链接 #标题
#设置网址 
layout: inline
links:
  柠檬一柠檬: http://www.canghaiyixiao.cn

设置标签云和网易云音乐

#npm安装标签云插件
npm install hexo-tag-cloud@^2.0.*

🤫在主题文件夹找到文件 theme/next/layout/_macro/sidebar.swig, 然后添加如下代码：

  <div class="site-overview-wrap sidebar-panel">
    {
  { partial('_partials/sidebar/site-overview.swig', {}, {cache: theme.cache.enable}) }}

    {
  {- next_inject('sidebar') }}
  </div>

  {%- if theme.back2top.enable and theme.back2top.sidebar %}
    <div class="back-to-top motion-element">
      <i class="fa fa-arrow-up">