Hexo 6.x结合Next 8.x搭建（二）

发表于 更新于 阅读次数： 本文字数： 1.3k 阅读时长 ≈ 6 分钟

Next配置

Next官方文档
里面啥都有，看完之后不需要再往下看，下面仅为个人搭建过程备份。

生成静态页面后移除非必要文件

1
2
# Remove unnecessary files after hexo generate.
minify: true

自定义样式

1
2
3
4
5
6
7
8
9
10
11
12
13
# Define custom file paths.
# Create your custom files in site directory `source/_data` and uncomment needed files below.
custom_file_path:
  #head: source/_data/head.njk
  #header: source/_data/header.njk
  #sidebar: source/_data/sidebar.njk
  #postMeta: source/_data/post-meta.njk
  #postBodyEnd: source/_data/post-body-end.njk
  #footer: source/_data/footer.njk
  #bodyEnd: source/_data/body-end.njk
  variable: source/_data/variables.styl
  #mixin: source/_data/mixins.styl
  style: source/_data/styles.styl
source/_data/styles.styl
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// 页面最大宽度
//@media (min-width: 1600px) {
//  .main {
//    max-width: 1440px;
//  }
//}

// 圆角
.site-brand-container {
  border-top-right-radius: 16px;
  border-top-left-radius: 16px;
}
// 顶部留空白
.header {
  margin-top: 16px;
}
// 顶部留空白
.main-inner {
  margin-top: 16px;
}
// 系列文章样式自定义
.post-series {
  margin: 1em 0 0;
}
// 系列文章样式自定义
.post-series-title {
  font-size: 1.25em;
  font-weight: bold;
}
// 顶部黑条不显示
.headband {
  display: none;
}
source/_data/variables.styl
1
2
3
4
5
6
// 内容最大宽度
//$content-desktop-largest = 95%
// 圆角
$border-radius-inner = 16px
$border-radius = 16px
$btn-default-radius = 16px

主题风格切换

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

夜间模式

1
2
# Dark Mode
darkmode: true

网站图标

七牛云图床
待补充使用教程

1
2
3
4
5
6
favicon:
  small: http://cdn.jackkke.top/blog/images/favicon-16x16-next_j.png
  medium: http://cdn.jackkke.top/blog/images/favicon-32x32-next_j.png
  apple_touch_icon: http://cdn.jackkke.top/blog/images/apple-touch-icon-next_j.png
  safari_pinned_tab: http://cdn.jackkke.top/blog/images/logo.svg
  #android_manifest: /manifest.json

版权声明

1
2
3
4
5
6
7
8
9
10
creative_commons:
  # Available values: by | by-nc | by-nc-nd | by-nc-sa | by-nd | by-sa | cc-zero
  license: by-nc-sa
  # Available values: big | small
  size: small
  sidebar: true
  post: true
  # You can set a language value if you prefer a translated version of CC license, e.g. deed.zh
  # CC licenses are available in 39 languages, you can find the specific and correct abbreviation you need on https://creativecommons.org
  language: deed.zh

菜单配置

1
2
3
4
5
6
7
8
9
10
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
  我的导航: /nav/ || fa  fa-compass

侧边栏显示文章数量

1
2
3
4
# Enable / Disable menu icons / item badges.
menu_settings:
  icons: true
  badges: true

头像设置

1
2
3
4
5
6
7
8
# Sidebar Avatar
avatar:
  # Replace the default image and set the url here.
  url: http://cdn.jackkke.top/blog/images/jackkke.jpg
  # If true, the avatar will be displayed in circle.
  rounded: true
  # If true, the avatar will be rotated with the cursor.
  rotated: true

社交媒体配置

1
2
3
4
5
6
7
8
social:
  GitHub: https://github.com/jackkke || fab fa-github
  E-Mail: mailto:[email protected] || fa fa-envelope
  Weibo: https://weibo.com/jackkke || fab fa-weibo
social_icons:
  enable: true
  icons_only: false
  transition: true

底部信息

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
footer:
  # Specify the year when the site was setup. If not defined, current year will be used.
  since: 2016

  # Icon between year and copyright info.
  icon:
    # Icon name in Font Awesome. See: https://fontawesome.com/icons
    name: fa fa-heart
    # If you want to animate the icon, set it to true.
    animated: false
    # Change the color of icon, using Hex Code.
    color: "#ff0000"

  # If not defined, `author` from Hexo `_config.yml` will be used.
  copyright: Copyed By Jackkke

  # Powered by Hexo & NexT
  powered: false

字数总计配置

1
2
3
symbols_count_time:
  separated_meta: true
  item_text_total: true

打赏，不必

1
2
3
4
5
6
7
8
reward_settings:
  # If true, a donate button will be displayed in every article by default.
  enable: true
  animation: true
  comment: duck 不必！

reward:
  wechatpay: http://cdn.jackkke.top/blog/images/wechatpay.jpg

相关文章（不准确，已关闭）

1
2
3
4
related_posts:
  enable: false
  title: 相关文章 # Custom header, leave empty to use the default one
  display_in_home: true

文章在线编辑（已关闭）

1
2
3
post_edit:
  enable: false
  url: https://github.com/jackkke/blog/tree/main/source/

预加载 字体与js等

1
preconnect: true

代码块格式，适配暗夜模式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
codeblock:
  # Code Highlight theme
  # All available themes: https://theme-next.js.org/highlight/
  theme:
    light: atom-one-light # default github stackoverflow-light
    dark: tomorrow-night-bright # atom-one-dark atom-one-dark-reasonable github-dark github-dark-dimmed stackoverflow-dark
  prism:
    light: prism
    dark: prism-dark
  # Add copy button on codeblock
  copy_button:
    enable: true
    # Available values: default | flat | mac
    style: flat

返回顶部

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

文章阅读进度顶部进度条

1
2
3
4
5
6
7
8
9
10
# Reading progress bar
reading_progress:
  enable: true
  # Available values: left | right
  start_at: left
  # Available values: top | bottom
  position: top
  reversed: false
  color: "#37c6c0"
  height: 3px

书签记录下次进入上次记录页面（已关闭）

1
2
3
4
5
6
7
8
bookmark:
  # 与 github_banner 位置重叠，暂时不做放开
  enable: false
  # Customize the color of the bookmark.
  color: "#222"
  # If auto, save the reading progress when closing the page or clicking the bookmark-icon.
  # If manual, only save it by clicking the bookmark-icon.
  save: auto

右上角 Follow 图标

1
2
3
4
github_banner:
  enable: true
  permalink: https://github.com/jackkke
  title: Follow me on GitHub

自定义字体，强推 JetBrains Mono

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
font:
  enable: true
  host: https://fonts.loli.net # https://fonts.font.im
  global:
    external: true
    family: JetBrains Mono
    size:
  title:
    external: true
    family: JetBrains Mono
    size:
  headings:
    external: true
    family: JetBrains Mono
    size:
  posts:
    external: true
    family: JetBrains Mono
  codes:
    external: true
    family: JetBrains Mono

副标题主页显示

1
index_with_subtitle: true

页面部署压缩

1
pangu: true

评论系统

1
2
3
4
5
6
7
utterances:
  enable: true
  repo: jackkke/blogUtterances # Github repository owner and name
  # Available values: pathname | url | title | og:title
  issue_term: pathname
  # Available values: github-light | github-dark | preferred-color-scheme | github-dark-orange | icy-dark | dark-blue | photon-dark | boxy-light
  theme: preferred-color-scheme

页面访问统计

1
2
3
4
5
6
7
8
busuanzi_count:
  enable: true
  total_visitors: true
  total_visitors_icon: fa fa-user
  total_views: true
  total_views_icon: fa fa-eye
  post_views: true
  post_views_icon: far fa-eye

本地搜索

1
2
3
4
5
6
7
8
9
10
11
local_search:
  enable: true
  # If auto, trigger search by changing input.
  # If manual, trigger search by pressing enter key or search button.
  trigger: auto
  # Show top n results per article, show all results by setting to -1
  top_n_per_article: 1
  # Unescape html strings to the readable one.
  unescape: false
  # Preload the search data when the page loads.
  preload: false

国内加载js加速

1
2
3
4
5
6
7
8
9
10
11
12
13
14
vendors:
  # The CDN provider of NexT internal scripts.
  # Available values: local | jsdelivr | unpkg | cdnjs | custom
  # Warning: If you are using the latest master branch of NexT, please set `internal: local`
  internal: custom
  # The default CDN provider of third-party plugins.
  # Available values: local | jsdelivr | unpkg | cdnjs | custom
  # Dependencies for `plugins: local`: https://github.com/next-theme/plugins
  plugins: custom
  # Custom CDN URL
  # For example:
  # custom_cdn_url: https://cdn.jsdelivr.net/npm/${npm_name}@${version}/${minified}
  # custom_cdn_url: https://cdnjs.cloudflare.com/ajax/libs/${cdnjs_name}/${version}/${cdnjs_file}
  custom_cdn_url: https://cdn.bootcdn.net/ajax/libs/${cdnjs_name}/${version}/${cdnjs_file}
系列文章