Hexo+NexT搭建博客笔记

前言

之前的博客感觉胡乱抄别人的“优化”代码，现在已经感觉理不清里面的结构了，所以一气之下还是重新安装了

安装HEXO

官网说可以这样子安装

npm install hexo-cli -g
hexo init blog
cd blog
npm install

安装主题

之前的Next仓库是 https://github.com/iissnan/hexo-theme-next

新版本的Next已经移动到这里了 https://github.com/theme-next/hexo-theme-next

旧的仓库几乎已经不更新了

只要用最简单的git命令就可以安装了

git clone https://github.com/theme-next/hexo-theme-next themes/next

基本配置

配置的是主题下的_config.yml文件，就是blog\themes\next路径下的配置文件

网站图标

网站图标生成网站

只要把png图片放进去（尺寸不能太大）

就可以生成一套图标（苹果手机桌面图标，网页图标，win磁贴图标等等）

下载之后放到blog\source\my_images文件夹中

favicon:
  small: /my_images/favicon-16x16.png
  medium: /my_images/favicon-32x32.png
  apple_touch_icon: /my_images/apple-touch-icon.png
  safari_pinned_tab: /my_images/safari-pinned-tab.svg
  android_manifest: /my_images/site.webmanifest
  ms_browserconfig: /my_images/browserconfig.xml

网站脚注

footer:
#建站时间
  since: 2018
#作者头像并且是动画效果
  icon:
    name: user
    animated: true
    color: "##66CDAA"
#显示版权作者
  copyright: Janking
#不显示Hexo
  powered:
    enable: false
    version: false
#不显示主题和版本
  theme:
    enable: false
    version: false
#显示备案号
  beian:
    enable: true
    icp: 粤ICP备18059833号-3

版权声明

具体详情

creative_commons:
  license: by-nc-sa
  sidebar: true
  post: true

代码块

codeblock:
  # 自定义边框半径，默认是1
  # 值越大弧度越大
  border_radius: 6
  # 右上角显示复制按钮
  copy_button:
    enable: true
    # 显示复制结果
    show_result: true

分享

needmoreshare2:
  enable: true
  postbottom:
  #文章底部
    enable: false
    options:
      iconStyle: box
      boxForm: horizontal
      position: bottomCenter
      networks: Weibo,Wechat,Douban,QQZone,Twitter,Facebook
      #左下角悬浮按钮
  float:
    enable: true
    options:
      iconStyle: box
      boxForm: horizontal
      position: middleRight
      networks: Weibo,Wechat,Douban,QQZone,Twitter,Facebook

访问次数

# busuanzi统计
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

顶部阅读进度条

reading_progress:
  enable: true
  color: "#37c6c0"
  height: 2px

加载动画

motion:
# 启用
  enable: true
  # 异步加载
  async: true
  transition:
    # Transition variants: