你笑了

你的笑，是星星跳跃浪花的笑

0%

hexo配置

发表于 分类于

站点

  • hexo 的配置文件，根目录下的 _config.yml

站点信息

  • title

    标题

  • subtitle

    副标题

  • description

    描述

  • author

    作者信息

  • language

    站点语言，需要根据主题languages目录下的文件名设置

    languages目录下每个文件对应一种语言

  • timezone

    站点所在时区

    中国时区标识符为 Asia/Shanghai

文章链接

主题

  • 主题的配置文件，在主题根目录下的 _config.yml

安装

1
2
3
4
# 在hexo跟目录执行以下命令
git clone https://github.com/theme-next/hexo-theme-next themes/next
# 修改主题配置文件 theme 字段，指定主题，主题名即主题文件所在的目录名
theme: next

配置

favicon

  • 配置网站 favicon

  • 将 png 图片放在主题 source/images 目录下，修改主题配置文件

    1
    2
    3
    favicon:
      small: /images/favicon.png
      medium: /images/favicon.png
since
  • 建站时间

powered

  • 显示由 Hexo & NexT 驱动
备案

  • 添加备案信息

    1
    2
    3
    4
    # Beian ICP and gongan information for Chinese users. See: https://beian.miit.gov.cn, http://www.beian.gov.cn
      beian:
        enable: true
        icp: 粤ICP备2021129701号

scheme

  • 选择 next 主题的样式

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

  • 默认只有home、archives 菜单，其他需要先创建再打开

    1
    2
    3
    4
    5
    6
    7
    8
    9
    menu:
      home: / || fa fa-home
      #about: /about/ || fa fa-user
      #tags: /tags/ || fa fa-tags
      categories: /categories/ || fa fa-th
      # archives: /archives/ || fa fa-archive
      #schedule: /schedule/ || fa fa-calendar
      #sitemap: /sitemap.xml || fa fa-sitemap
      #commonweal: /404/ || fa fa-heartbeat
分类

  • 创建分类菜单

    1
    2
    3
    4
    # 进入hexo根目录
    cd your-hexo-site
    # 新建 categories 页面
    $ hexo new page categories

    在hexo的 source 目录下新增 categories 目录及目录下的 index.md 文件

  • 在index.md 文件中添加页面类型

    1
    2
    3
    4
    5
    ---
    title: categories
    date: 2021-08-07 01:21:10
    type: "categories"
    ---

  • 编辑主题配置文件，打开 categories 菜单

    1
    2
    3
    4
    5
    menu:
      home: / || fa fa-home
      #about: /about/ || fa fa-user
      #tags: /tags/ || fa fa-tags
      categories: /categories/ || fa fa-th

social

  • 添加社交信息

    1
    2
    3
    social:
      GitHub: https://github.com/lfpdev || fab fa-github
      博客园: https://www.cnblogs.com/usmile || fas fa-blog

    图标在 fontawesome 找

post_meta

  • 文章的元信息
1
2
3
4
5
6
7
8
9
post_meta:
  item_text: true
  # 创建时间
  created_at: true
  # 更新时间
  updated_at:
    enable: true
    another_day: true
  categories: true

back2top

  • 返回顶部及显示百分比

    1
    2
    3
    4
    5
    6
    back2top:
      enable: true
      # Back to top in sidebar.
      sidebar: true
      # Scroll percent label in b2t button.
      scrollpercent: true

个性化

主页文章分隔样式

  • 文章边框添加阴影

    在themes/next/source/css/main.styl 中添加

    1
    2
    3
    4
    5
    6
    7
    8
    // 主页文章添加阴影效果
    .post-block {
       margin-top: 0px;
       margin-bottom: 24px;
       padding: 35px;
       -webkit-box-shadow: 0 0 24px rgba(202, 203, 203, .5);
       -moz-box-shadow: 0 0 5px rgba(202, 203, 204, .5);
    }

  • 取消文章间分割线

    在themes/next/source/css/_common/components/post/post-eof.styl中修改

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    .post-eof {
      background: $grey-light;
      height: 0px;
      // height: 1px;
      // margin: $post-eof-margin-top auto $post-eof-margin-bottom;
      text-align: center;
      width: 8%;

      .post-block:last-of-type & {
        display: none;
      }
    }

插件

自动分类

安装

1
npm install hexo-auto-category -S

配置

  • 在站点配置文件中添加

    1
    2
    3
    4
    5
    6
    # Generate categories from directory-tree
    # Dependencies: https://github.com/xu-song/hexo-auto-category
    # depth: the depth of directory-tree you want to generate, should > 0
    auto_category:
     enable: true
     depth: 1

文章

创建文章

  • 通过以下命令在blog根目录下的source文件夹中的_post文件夹中创建文章
1
hexo n 文章名称

添加摘要

  • 在文章中添加<!-- more --> 标识符，前面为摘要，显示在主页，后面的内容需要阅读全文查看
1
2
3
摘要部分
<!-- more -->
正文

预览及发布

  • hexo 根目录下的 package.json 文件的 scripts 项中添加以下命令

    1
    2
    "dev": "hexo g && hexo s --debug",
    "pub": "hexo clean && hexo g -d",

  • 根目录下执行npm dev 在本地预览

  • 根目录下执行npm pub 发布到服务器

参考