个人博客（七）主题 NexT 设置

最新推荐文章于 2021-12-11 21:25:02 发布
最新推荐文章于 2021-12-11 21:25:02 发布
阅读量182 收藏
点赞数
分类专栏： 用github建个人博客 文章标签： hexo
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_56904230/article/details/115457712
版权

汇总：零基础小白如何用github搭建免费的个人博客

目录

这一篇主要就是参考了官方使用文档。
我的博客：SLAngels

前提：已经用 Hexo 在 GitHub 上搞了一个个人博客。

没有搞过的可以看看我的过程：零基础小白如何用github搭建个人博客，里面详细的介绍了我的每一个步骤，保姆级教程哈。如果是大佬们就不用看了。

Hexo：可以用 Markdown 编写文章，还可以使用 Hexo 提供的 标签插件 来快速的插入特定形式的内容。

站点配置文件：slangelsBlog\_config.yml
主题配置文件：slangelsBlog\themes\next\_config.yml

验证主题

先用命令hexo clean来清除 Hexo 的缓存。

再启动 Hexo 本地站点，并开启调试模式，命令是hexo s --debug，可以看到出现了INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.的提示，就可以用浏览器访问 localhost:4000 了。

以下太长了就不要看了，可以通过目录跳转。

D:\blog\slangelsBlog>hexo clean
INFO  Validating config
INFO  ==================================
  ███╗   ██╗███████╗██╗  ██╗████████╗
  ████╗  ██║██╔════╝╚██╗██╔╝╚══██╔══╝
  ██╔██╗ ██║█████╗   ╚███╔╝    ██║
  ██║╚██╗██║██╔══╝   ██╔██╗    ██║
  ██║ ╚████║███████╗██╔╝ ██╗   ██║
  ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═╝   ╚═╝
========================================
NexT version 8.3.0
Documentation: https://theme-next.js.org
========================================
INFO  Deleted database.
INFO  Deleted public folder.

D:\blog\slangelsBlog>hexo s --debug
04:05:51.842 DEBUG Writing database to D:\blog\slangelsBlog/db.json
04:05:51.867 DEBUG Hexo version: 5.4.0
04:05:51.870 DEBUG Working directory: D:\blog\slangelsBlog\
04:05:52.081 DEBUG Config loaded: D:\blog\slangelsBlog\_config.yml
04:05:52.087 INFO  Validating config
04:05:52.167 DEBUG Plugin loaded: hexo-deployer-git
04:05:52.170 DEBUG Plugin loaded: hexo-generator-archive
04:05:52.175 DEBUG Plugin loaded: hexo-generator-category
04:05:52.179 DEBUG Plugin loaded: hexo-generator-index
04:05:52.184 DEBUG Plugin loaded: hexo-generator-tag
04:05:52.188 DEBUG Plugin loaded: hexo-renderer-ejs
04:05:52.585 DEBUG Plugin loaded: hexo-renderer-marked
04:05:52.588 DEBUG Plugin loaded: hexo-renderer-stylus
04:05:52.592 DEBUG Plugin loaded: hexo-server
04:05:52.656 DEBUG Script loaded: themes\next\scripts\events\index.js
04:05:52.658 DEBUG Script loaded: themes\next\scripts\filters\default-injects.js

04:05:52.659 DEBUG Script loaded: themes\next\scripts\filters\locals.js
04:05:52.661 DEBUG Script loaded: themes\next\scripts\filters\minify.js
04:05:52.662 DEBUG Script loaded: themes\next\scripts\filters\post.js
04:05:52.663 DEBUG Script loaded: themes\next\scripts\helpers\engine.js
04:05:52.665 DEBUG Script loaded: themes\next\scripts\helpers\font.js
04:05:52.666 DEBUG Script loaded: themes\next\scripts\helpers\next-config.js
04:05:52.667 DEBUG Script loaded: themes\next\scripts\helpers\next-url.js
04:05:52.669 DEBUG Script loaded: themes\next\scripts\helpers\next-vendors.js
04:05:52.670 DEBUG Script loaded: themes\next\scripts\tags\button.js
04:05:52.671 DEBUG Script loaded: themes\next\scripts\tags\caniuse.js
04:05:52.673 DEBUG Script loaded: themes\next\scripts\tags\center-quote.js
04:05:52.675 DEBUG Script loaded: themes\next\scripts\tags\group-pictures.js
04:05:52.677 DEBUG Script loaded: themes\next\scripts\tags\index.js
04:05:52.679 DEBUG Script loaded: themes\next\scripts\tags\label.js
04:05:52.684 DEBUG Script loaded: themes\next\scripts\tags\link-grid.js
04:05:52.689 DEBUG Script loaded: themes\next\scripts\tags\mermaid.js
04:05:52.692 DEBUG Script loaded: themes\next\scripts\tags\note.js
04:05:52.696 DEBUG Script loaded: themes\next\scripts\tags\pdf.js
04:05:52.700 DEBUG Script loaded: themes\next\scripts\tags\tabs.js
04:05:52.705 DEBUG Script loaded: themes\next\scripts\tags\video.js
04:05:52.708 DEBUG Script loaded: themes\next\scripts\events\lib\config.js
04:05:52.713 DEBUG Script loaded: themes\next\scripts\events\lib\highlight.js
04:05:52.718 DEBUG Script loaded: themes\next\scripts\events\lib\injects.js
04:05:52.723 DEBUG Script loaded: themes\next\scripts\events\lib\utils.js
04:05:52.726 DEBUG Script loaded: themes\next\scripts\events\lib\vendors.js
04:05:52.730 DEBUG Script loaded: themes\next\scripts\filters\comment\changyan.js
04:05:52.735 DEBUG Script loaded: themes\next\scripts\filters\comment\common.js
04:05:52.739 DEBUG Script loaded: themes\next\scripts\filters\comment\default-config.js
04:05:52.743 DEBUG Script loaded: themes\next\scripts\filters\comment\disqus.js
04:05:52.747 DEBUG Script loaded: themes\next\scripts\filters\comment\disqusjs.js
04:05:52.752 DEBUG Script loaded: themes\next\scripts\filters\comment\gitalk.js
04:05:52.760 DEBUG Script loaded: themes\next\scripts\filters\comment\isso.js
04:05:52.763 DEBUG Script loaded: themes\next\scripts\filters\comment\livere.js
04:05:52.768 DEBUG Script loaded: themes\next\scripts\filters\comment\utterances.js
04:05:52.776 INFO  ==================================
  ███╗   ██╗███████╗██╗  ██╗████████╗
  ████╗  ██║██╔════╝╚██╗██╔╝╚══██╔══╝
  ██╔██╗ ██║█████╗   ╚███╔╝    ██║
  ██║╚██╗██║██╔══╝   ██╔██╗    ██║
  ██║ ╚████║███████╗██╔╝ ██╗   ██║
  ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═╝   ╚═╝
========================================
NexT version 8.3.0
Documentation: https://theme-next.js.org
========================================
04:05:52.810 INFO  Start processing
04:05:53.395 DEBUG Processed: _posts/hello-world.md
04:05:54.693 DEBUG Processed: source/css/main.styl
04:05:54.698 DEBUG Processed: source/images/apple-touch-icon-next.png
04:05:54.702 DEBUG Processed: source/images/avatar.gif
04:05:54.707 DEBUG Processed: source/images/cc-by-nc-nd.svg
04:05:54.710 DEBUG Processed: source/images/cc-by-nc-sa.svg
04:05:54.715 DEBUG Processed: source/images/cc-by-nd.svg
04:05:54.720 DEBUG Processed: source/images/cc-by-nc.svg
04:05:54.723 DEBUG Processed: source/images/cc-by-sa.svg
04:05:54.728 DEBUG Processed: source/images/cc-by.svg
04:05:54.732 DEBUG Processed: source/images/cc-zero.svg
04:05:54.737 DEBUG Processed: source/images/favicon-16x16-next.png
04:05:54.741 DEBUG Processed: source/images/favicon-32x32-next.png
04:05:54.746 DEBUG Processed: source/images/logo-algolia-nebula-blue-full.svg
04:05:54.750 DEBUG Processed: source/images/logo.svg
04:05:54.751 DEBUG Processed: source/js/algolia-search.js
04:05:54.753 DEBUG Processed: source/js/bookmark.js
04:05:54.755 DEBUG Processed: source/js/motion.js
04:05:54.757 DEBUG Processed: source/js/next-boot.js
04:05:54.760 DEBUG Processed: source/js/local-search.js
04:05:54.764 DEBUG Processed: source/js/schedule.js
04:05:54.769 DEBUG Processed: source/js/utils.js
04:05:54.772 DEBUG Processed: source/js/schemes/muse.js
04:05:54.951 DEBUG Processed: layout/_layout.njk
04:05:54.952 DEBUG Processed: layout/archive.njk
04:05:54.954 DEBUG Processed: layout/category.njk
04:05:54.955 DEBUG Processed: layout/index.njk
04:05:54.956 DEBUG Processed: layout/page.njk
04:05:54.958 DEBUG Processed: layout/tag.njk
04:05:54.959 DEBUG Processed: layout/post.njk
04:05:54.960 DEBUG Processed: layout/_partials/comments.njk
04:05:54.962 DEBUG Processed: layout/_partials/footer.njk
04:05:54.964 DEBUG Processed: layout/_partials/pagination.njk
04:05:54.968 DEBUG Processed: layout/_partials/languages.njk
04:05:54.972 DEBUG Processed: layout/_partials/widgets.njk
04:05:54.977 DEBUG Processed: layout/_macro/post-collapse.njk
04:05:54.981 DEBUG Processed: layout/_macro/sidebar.njk
04:05:54.985 DEBUG Processed: layout/_macro/post.njk
04:05:54.989 DEBUG Processed: layout/_scripts/index.njk
04:05:54.994 DEBUG Processed: layout/_scripts/noscript.njk
04:05:54.998 DEBUG Processed: layout/_scripts/vendors.njk
04:05:55.003 DEBUG Processed: layout/_scripts/pjax.njk
04:05:55.006 DEBUG Processed: layout/_third-party/quicklink.njk
04:05:55.009 DEBUG Processed: layout/_third-party/index.njk
04:05:55.014 DEBUG Processed: layout/_third-party/rating.njk
04:05:55.018 DEBUG Processed: layout/_third-party/nprogress.njk
04:05:55.023 DEBUG Processed: layout/_partials/head/head-unique.njk
04:05:55.027 DEBUG Processed: layout/_partials/head/head.njk
04:05:55.031 DEBUG Processed: layout/_partials/header/index.njk
04:05:55.036 DEBUG Processed: layout/_partials/header/menu-item.njk
04:05:55.040 DEBUG Processed: layout/_partials/header/brand.njk
04:05:55.044 DEBUG Processed: layout/_partials/header/menu.njk
04:05:55.049 DEBUG Processed: layout/_partials/header/sub-menu.njk
04:05:55.053 DEBUG Processed: layout/_partials/page/breadcrumb.njk
04:05:55.057 DEBUG Processed: layout/_partials/page/categories.njk
04:05:55.062 DEBUG Processed: layout/_partials/page/page-header.njk
04:05:55.067 DEBUG Processed: layout/_partials/page/schedule.njk
04:05:55.071 DEBUG Processed: layout/_partials/page/tags.njk
04:05:55.076 DEBUG Processed: layout/_partials/post/post-copyright.njk
04:05:55.079 DEBUG Processed: layout/_partials/post/post-followme.njk
04:05:55.084 DEBUG Processed: layout/_partials/post/post-related.njk
04:05:55.089 DEBUG Processed: layout/_partials/post/post-footer.njk
04:05:55.093 DEBUG Processed: layout/_partials/post/post-meta.njk
04:05:55.098 DEBUG Processed: layout/_partials/post/post-reward.njk
04:05:55.103 DEBUG Processed: layout/_partials/search/algolia-search.njk
04:05:55.107 DEBUG Processed: layout/_partials/search/index.njk
04:05:55.111 DEBUG Processed: layout/_partials/search/localsearch.njk
04:05:55.116 DEBUG Processed: layout/_partials/sidebar/site-overview.njk
04:05:55.120 DEBUG Processed: layout/_third-party/analytics/baidu-analytics.njk
04:05:55.125 DEBUG Processed: layout/_third-party/analytics/cloudflare.njk
04:05:55.129 DEBUG Processed: layout/_third-party/analytics/google-analytics.njk

04:05:55.134 DEBUG Processed: layout/_third-party/analytics/growingio.njk
04:05:55.137 DEBUG Processed: layout/_third-party/analytics/index.njk
04:05:55.142 DEBUG Processed: layout/_third-party/chat/tidio.njk
04:05:55.147 DEBUG Processed: layout/_third-party/chat/chatra.njk
04:05:55.151 DEBUG Processed: layout/_third-party/comments/changyan.njk
04:05:55.157 DEBUG Processed: layout/_third-party/comments/disqus.njk
04:05:55.160 DEBUG Processed: layout/_third-party/comments/gitalk.njk
04:05:55.164 DEBUG Processed: layout/_third-party/comments/livere.njk
04:05:55.167 DEBUG Processed: layout/_third-party/comments/disqusjs.njk
04:05:55.170 DEBUG Processed: layout/_third-party/comments/isso.njk
04:05:55.174 DEBUG Processed: layout/_third-party/comments/utterances.njk
04:05:55.177 DEBUG Processed: layout/_third-party/math/index.njk
04:05:55.180 DEBUG Processed: layout/_third-party/math/katex.njk
04:05:55.183 DEBUG Processed: layout/_third-party/math/mathjax.njk
04:05:55.187 DEBUG Processed: layout/_third-party/search/localsearch.njk
04:05:55.191 DEBUG Processed: layout/_third-party/statistics/busuanzi-counter.njk
04:05:55.195 DEBUG Processed: layout/_third-party/search/algolia-search.njk
04:05:55.198 DEBUG Processed: layout/_third-party/statistics/firestore.njk
04:05:55.201 DEBUG Processed: layout/_third-party/statistics/lean-analytics.njk
04:05:55.205 DEBUG Processed: layout/_third-party/statistics/index.njk
04:05:55.209 DEBUG Processed: layout/_third-party/tags/mermaid.njk
04:05:55.212 DEBUG Processed: layout/_third-party/tags/pdf.njk
04:05:55.226 DEBUG Processed: languages/ar.yml
04:05:55.231 DEBUG Processed: languages/de.yml
04:05:55.237 DEBUG Processed: languages/default.yml
04:05:55.245 DEBUG Processed: languages/README.md
04:05:55.249 DEBUG Processed: languages/en.yml
04:05:55.260 DEBUG Processed: languages/es.yml
04:05:55.263 DEBUG Processed: languages/fa.yml
04:05:55.265 DEBUG Processed: languages/id.yml
04:05:55.267 DEBUG Processed: languages/fr.yml
04:05:55.270 DEBUG Processed: languages/ja.yml
04:05:55.272 DEBUG Processed: languages/ko.yml
04:05:55.274 DEBUG Processed: languages/it.yml
04:05:55.276 DEBUG Processed: languages/nl.yml
04:05:55.277 DEBUG Processed: languages/pt-BR.yml
04:05:55.279 DEBUG Processed: languages/pt.yml
04:05:55.280 DEBUG Processed: languages/ru.yml
04:05:55.282 DEBUG Processed: languages/si.yml
04:05:55.283 DEBUG Processed: languages/uk.yml
04:05:55.285 DEBUG Processed: languages/tr.yml
04:05:55.286 DEBUG Processed: languages/vi.yml
04:05:55.288 DEBUG Processed: languages/zh-CN.yml
04:05:55.289 DEBUG Processed: languages/zh-TW.yml
04:05:55.291 DEBUG Processed: languages/zh-HK.yml
04:05:55.299 DEBUG Theme config loaded.
04:05:55.301 DEBUG Processed: _config.yml
Deprecated as of 10.7.0. highlight(lang, code, ...args) has been deprecated.
Deprecated as of 10.7.0. Please use highlight(code, options) instead.
https://github.com/highlightjs/highlight.js/issues/2277
04:05:55.783 DEBUG Rendering post: D:\blog\slangelsBlog\source\_posts\hello-world.md
04:05:55.815 DEBUG Generator: page
04:05:55.818 DEBUG Generator: post
04:05:55.819 DEBUG Generator: archive
04:05:55.821 DEBUG Generator: category
04:05:55.825 DEBUG Generator: index
04:05:55.829 DEBUG Generator: tag
04:05:55.838 DEBUG Generator: asset
04:05:55.858 INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
04:05:55.883 DEBUG Database saved

外观 Scheme：选择Mist

NexT 8.3.0 代码里看到有4种外观，分别是：Muse、Mist、Pisces和Gemini。

在slangelsBlog\themes\next\_config.yml文件中搜索 scheme 关键字，就可以看到以下代码：

# ---------------------------------------------------------------
# Scheme Settings
# ---------------------------------------------------------------

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

可以通过调节 scheme 前面的 # 来选择外观。

选择完了记得保存，否则就算没动过哈。
然后重复 验证主题 时的命令，查看效果。

默认的外观：Muse

Scheme: Muse

Mist

Scheme: Mist

Pisces

Scheme: Pisces

Gemini

咦，这个好像跟上面的没差呀。
scheme: Gemini

语言：妥妥的选择中文啦

打开slangelsBlog\_config.yml文件，就可以看到以下代码：

# Site
title: Hexo
subtitle: ''
description: ''
keywords:
author: slangels
language: en
timezone: ''

我们改成简体中文：language: zh-Hans

看一下效果：！！！这绝对是乱码了吧？？
语言乱码
看了一下slangelsBlog\themes\next\languages下的文件，发现中文有三种：
language: zh-CN
所以我们把语言改成中文：language: zh-CN

看一下效果：
语言：中文

菜单：自定义一个菜单项

在slangelsBlog\themes\next\_config.yml文件中搜索 menu 关键字，就可以看到以下代码：

# ---------------------------------------------------------------
# Menu Settings
# ---------------------------------------------------------------

# Usage: `Key: /link/ || icon`
# Key is the name of menu item. If the translation for this item is available, the translated text will be loaded, otherwise the Key name will be used. Key is case-senstive.
# Value before `||` delimiter is the target link, value after `||` delimiter is the name of Font Awesome icon.
# External url should start with http:// or https://
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

# Enable / Disable menu icons / item badges.
menu_settings:
  icons: true
  badges: false

emmmm看了一下感觉有点难，一步步来试吧。

先尝试做个‘首页’和‘关于’

可以看到菜单内容的设置格式是：Key: /link/ || icon。

  • Key是菜单项的名字，一般都是英文，如果在翻译文件slangelsBlog\themes\next\languages\zh-CN.yml中有对应的话，那么就显示翻译的东西；如果没有就直接显示Key。
  • || 之前以 / 开头的是目标链接，意思是点一下这个菜单项需要跳转的页面。
  • || 之后的是图标。

我们就直接把 # 去掉，然后这一行代码就变成home: / || fa fa-home，运行一下看看：
在这里插入图片描述
点一下就相当于刷新了一下…那再来做个关于的页面吧。

直接把 # 去掉，然后这一行代码就变成about: /about/ || fa fa-user，运行一下看看：
在这里插入图片描述
可以看到所在的是首页，所以首页背景是深色的。点一下关于试试。

会跳出一个空白的页面，显示：Cannot GET /about/。说没有找到这个页面。那么我们来创建一个页面。

执行命令hexo new page "about"：

D:\blog\slangelsBlog>hexo new page "about"
INFO  Validating config
INFO  ==================================
  ███╗   ██╗███████╗██╗  ██╗████████╗
  ████╗  ██║██╔════╝╚██╗██╔╝╚══██╔══╝
  ██╔██╗ ██║█████╗   ╚███╔╝    ██║
  ██║╚██╗██║██╔══╝   ██╔██╗    ██║
  ██║ ╚████║███████╗██╔╝ ██╗   ██║
  ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═╝   ╚═╝
========================================
NexT version 8.3.0
Documentation: https://theme-next.js.org
========================================
INFO  Created: D:\blog\slangelsBlog\source\about\index.md

D:\blog\slangelsBlog>

可以看到在slangelsBlog\source目录下创建了一个about文件夹，并且有一个index.md的文件：
在这里插入图片描述
现在再点一下菜单的关于，可以看到：
在这里插入图片描述
我们来稍微写一点内容看一下。
在这里插入图片描述
点一下关于之后会跳出以下界面。有一个小小的问题：我写了标题之后，会自动跳出左边的侧边栏。
在这里插入图片描述

自定义一个‘小说’

在 home 和 about 之间写一行 novel 的代码，如下：

menu:
  home: / || fa fa-home
  novel: /novel/ || fas fa-books
  about: /about/ || fa fa-user

第一步：翻译，也就是显示出来的文字。

打开slangelsBlog\themes\next\languages\zh-CN.yml文件，找到菜单 menu 栏下，添加novel: 小说：
在这里插入图片描述
第二步：添加页面，也就是点击‘小说’之后出来的页面。

运行命令hexo new page "novel"来创建一个页面。

D:\blog\slangelsBlog>hexo new page "novel"
INFO  Validating config
INFO  ==================================
  ███╗   ██╗███████╗██╗  ██╗████████╗
  ████╗  ██║██╔════╝╚██╗██╔╝╚══██╔══╝
  ██╔██╗ ██║█████╗   ╚███╔╝    ██║
  ██║╚██╗██║██╔══╝   ██╔██╗    ██║
  ██║ ╚████║███████╗██╔╝ ██╗   ██║
  ╚═╝  ╚═══╝╚══════╝╚═╝  ╚═╝   ╚═╝
========================================
NexT version 8.3.0
Documentation: https://theme-next.js.org
========================================
INFO  Created: D:\blog\slangelsBlog\source\novel\index.md

D:\blog\slangelsBlog>

可以看到在slangelsBlog\source目录下创建了一个novel文件夹，并且有一个index.md的文件，写一点点内容：
在这里插入图片描述
第三步：设置图标。

打开提供图标的网站 Font Awesome：
在这里插入图片描述
左上角搜索关键词，点击打开自己喜欢的图标：
在这里插入图片描述
复制代码：
在这里插入图片描述
运行一下，发现小图标没显示出来：
在这里插入图片描述
找了找原因，发现是因为那个图标是Pro版本的，需要买会员才能用。于是就换了下面的小图标，把代码改成novel: /novel/ || fas fa-book：
在这里插入图片描述
看一下效果：
在这里插入图片描述
完成！

侧栏

在slangelsBlog\themes\next\_config.yml文件中搜索 sidebar 关键字，就可以看到以下代码：

# ---------------------------------------------------------------
# Sidebar Settings
# See: https://theme-next.js.org/docs/theme-settings/sidebar
# ---------------------------------------------------------------

sidebar:
  # Sidebar Position.
  position: left
  #position: right

  # Manual define the sidebar width. If commented, will be default for:
  # Muse | Mist: 320
  # Pisces | Gemini: 240
  #width: 300

  # Sidebar Display (only for Muse | Mist), available values:
  #  - post    expand on posts automatically. Default.
  #  - always  expand for all pages automatically.
  #  - hide    expand only when click on the sidebar toggle icon.
  #  - remove  totally remove sidebar including sidebar toggle.
  display: post

  # Sidebar padding in pixels.
  padding: 18
  # Sidebar offset from top menubar in pixels (only for Pisces | Gemini).
  offset: 12

# Sidebar Avatar
avatar:
  # Replace the default image and set the url here.
  url: #/images/avatar.gif
  # If true, the avatar will be dispalyed in circle.
  rounded: false
  # If true, the avatar will be rotated with the cursor.
  rotated: false

# Posts / Categories / Tags in sidebar.
site_state: true

# Social Links
# Usage: `Key: permalink || icon`
# Key is the link label showing to end users.
# Value before `||` delimiter is the target permalink, value after `||` delimiter is the name of Font Awesome icon.
social:
  #GitHub: https://github.com/yourname || fab fa-github
  #E-Mail: mailto:yourname@gmail.com || fa fa-envelope
  #Weibo: https://weibo.com/yourname || fab fa-weibo
  #Google: https://plus.google.com/yourname || fab fa-google
  #Twitter: https://twitter.com/yourname || fab fa-twitter
  #FB Page: https://www.facebook.com/yourname || fab fa-facebook
  #StackOverflow: https://stackoverflow.com/yourname || fab fa-stack-overflow
  #YouTube: https://youtube.com/yourname || fab fa-youtube
  #Instagram: https://instagram.com/yourname || fab fa-instagram
  #Skype: skype:yourname?call|chat || fab fa-skype

social_icons:
  enable: true
  icons_only: false
  transition: false

# Blog rolls
links_settings:
  icon: fa fa-globe
  title: Links
  # Available values: block | inline
  layout: block

links:
  #Title: https://example.com

# Table of Contents in the Sidebar
# Front-matter variable (unsupport wrap expand_all).
toc:
  enable: true
  # Automatically add list number to toc.
  number: true
  # If true, all words will placed on next lines if header width longer then sidebar width.
  wrap: false
  # If true, all level of TOC in a post will be displayed, rather than the activated part of it.
  expand_all: false
  # Maximum heading depth of generated toc.
  max_depth: 6

# A button to open designated chat widget in sidebar.
# Firstly, you need enable the chat service you want to activate its sidebar button.
chat:
  enable: false
  #service: chatra
  #service: tidio
  icon: fa fa-comment # Icon name in Font Awesome, set false to disable icon.
  text: Chat # Button text, change it as you wish.

侧栏在左边还是右边

可以改成右边的：
在这里插入图片描述
效果是：
在这里插入图片描述

侧栏宽度250

设置成 250，如果默认（就是把宽度这一行注释掉），那么 Muse和Mist 外观下默认320，Pisces和Gemini 外观下默认240：

  # Manual define the sidebar width. If commented, will be default for:
  # Muse | Mist: 320
  # Pisces | Gemini: 240
  width: 250

看一下效果：
在这里插入图片描述

侧栏显示时机

有4种：

  • post： 默认行为，在文章页面（拥有目录列表）时显示
  • always：在所有页面中都显示
  • hide：在所有页面中都隐藏（可以手动展开）
  • remove：完全移除

我选择了不会自动跳出来，可以手动展开的hide。

  # Sidebar Display (only for Muse | Mist), available values:
  #  - post    expand on posts automatically. Default.
  #  - always  expand for all pages automatically.
  #  - hide    expand only when click on the sidebar toggle icon.
  #  - remove  totally remove sidebar including sidebar toggle.
  display: hide

作者昵称和站点描述

打开slangelsBlog\_config.yml文件，把代码中的 author 和 description 改成自己喜欢的：

# Site
title: Hexo
subtitle: ''
description: '我的个人博客'
keywords:
author: slangels
language: zh-CN
timezone: ''

看一下效果：
在这里插入图片描述

七只小天使
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
gridea主题next
09-24
Gridea是一款强大的静态博客写作工具，它支持Markdown语法，让用户可以专注于内容...通过简单的安装和配置，你就可以拥有一个既美观又实用的个人博客。如果你是Gridea的用户，不妨试试这个主题，让你的博客焕然一新。
Hexo博客搭建文件（next主题）
12-07
在本案例中，我们关注的是使用Next主题来构建个人博客。Next主题以其优雅的设计和丰富的功能，成为Hexo用户中的热门选择。下面将详细介绍Hexo博客搭建以及Next主题的配置。 首先，你需要确保你的计算机上已经安装了...
Hexo + Next7.8 主题美化三
weixin_43720067的博客
04-20 248
前言 由于看见别人的博客里面都有在线留言，在线聊天功能，感觉挺有趣的，因此我也想给我的博客配置这个功能，感觉还十分的有趣，哈哈，废话不多说，开搞。 步骤详解 （1）在DaoCloud网站https://dashboard.daocloud.io/ 注册账号，并登录 （2）点击左边栏的 应用设置——>安装到网站 ，可以查看自己的app_id (3)修改/themes/next/layout/_partials/head.swig文件，添加内容如下： {% if theme.daovoice %}
给hexo主题添加背景及更改字体颜色（next的Mist主题）
热门推荐
姜姜酱的博客
02-28 1万+
最近新搭的个人博客：qsang.xin 采用的是hexo + Github，next主题，自己动手更改了一下 其实要更改某一部分，只需要F12找到元素然后找到相应元素就可以啦~ 进入正题 更改背景 找到博客目录下\themes\next\source\css_custom\custom.styl，加上以下代码： body { background-image:url(/images/ba...
Hexo个人博客NexT主题设置Scheme外观
野猿新一
06-19 2265
Scheme简介 Scheme 是 NexT 提供的一种特性，借助于 Scheme，NexT 为你提供多种不同的外观。同时，几乎所有的配置都可以 在 Scheme 之间共用。目前 NexT 支持三种 Scheme，他们是： Muse - 默认 Scheme，这是 NexT 最初的版本，黑白主调，大量留白 Mist - Muse 的紧凑版本，整洁有序的单栏外观 Pisces - 双栏 Sch...
Hexo 搭建个人博客（七）Hexo 配置 NexT 主题
wylu
11-27 1265
环境及版本声明 本文基于以下环境及版本： hexo: 3.8.0 hexo-cli: 1.1.0 NexT: 7.1.0 OS: Ubuntu 18.04 LTS x86_64 NexT 主题简介 NexT is a high quality elegant Hexo theme. 原项目已不再维护 NexT文档 Github 目前使用的是其社区版本 NexT文档 Github 描述约...
使用Hexo+Next搭建个人博客
river106的博客
12-11 1354
欢迎光临我的博客查看最新文章: https://rivers106.cn 1、博客系统：Hexo 官网：Hexo 安装(需要安装nodejs, nodejs自带了npm包管理) npm install hexo-cli -g Hexo 版本：5.4.0
基于Django开发的next主题个人博客网站
04-26
【标题】基于Django开发的Next主题个人博客网站 【正文】 Django是一个高级的Python Web框架，它鼓励快速开发并遵循MVT（Model-View-Template）设计模式。在这个项目中，开发者利用Django的强大功能创建了一个以...
hexo next主题
06-29
Next主题是Hexo的官方推荐主题之一，它提供了多种布局选择，包括个人博客、作品展示和文章列表。Next的特点包括： 1. **响应式设计**：无论在桌面、平板还是手机上，Next都能提供良好的阅读体验。 2. **多语言支持*...
hexo-next:个人博客的
03-23
【描述】：“六邻体”是一种基于Hexo框架的主题Next，常用于构建个人博客。它以其简洁、优雅的设计风格受到许多技术爱好者的青睐。本教程将详细介绍如何使用hexo-next搭建和优化个人博客。 【正文】： Hexo是一款...
matlab下载.pdf
07-14
matlab下载下载方式及注意事项
Android系统原理及开发要点详解-从入门到精通
07-13
Android系统原理及开发要点详解 Java4 Android视频教程 Android开发视频教学 从入门到精通 Android的软件管理器的开发教程视频 Android深入浅出_Android高端课程分享试听 JavaWeb Android系统的手机防盗软件的实现 Android开发入门与实战随书视频 视频列表.txt 0.0MB 开发入门与实战代码.rar 6.1MB 第9章 我来“广播”你的“意图”——Intent和Broadcast面对面.wmv 15.1MB 第8章 移动信息仓库——Android的数据存储操作之轻轻地我保护——SharedPreferences存储-2.wmv 0.6MB 第8章 移动信息仓库——Android的数据存储操作之轻轻地我保护——SharedPreferences存储-1.wmv 24.3MB 第8章 移动信息仓库——Android的数据存储操作之Android数据存储概述.wmv 57.7MB 第7章 良好的学习开端——Android基本组件介绍之友好地互动交流——对话框(Dialog)介绍与实例-2.wmv 7.
GESP等级认证 2024年6月 C++一级真题
07-14
GESP等级认证 2024年6月 C++一级真题 从官网上刚刚下载下来的,题都是热乎的,这可是最新真题 大家看一看瞧一瞧,走过路过不要错过,免费下载,全篇无水印,不好用随便吐槽我! 涵盖选择题,判断题,编程题,基础知识多,满满的干货,非常建议下载!!!!! 萌新小白来做做题,复习巩固都很合适!
大学生创业计划书(35)三份资料.doc
07-14
大学生创业计划书(35)三份资料.doc
大学生创业计划书(33)三个文档.doc
07-14
大学生创业计划书(33)三个文档.doc
大学生创业计划书(37)三份资料.doc
07-14
大学生创业计划书(37)三份资料.doc
前端分析-20230714004
07-14
前端分析-20230714004
SQL中的DELETE 语句使用详解.pdf
07-14
SQL中的DELETE 语句使用详解
selective-scan-cuda.cp310-win-amd64.pyd
最新发布
07-14
selective_scan_cuda 在Windows下对应的模块编译好的文件，可解决 No moudule named selective_scan_cuda.
hexo next博客
05-25
Hexo Next 是一个非常受欢迎的 Hexo 主题，它具有许多功能和可定制选项，可以使您的博客看起来非常专业。 要使用 Hexo Next 主题，您需要先安装 Hexo。安装完成后，您可以按照以下步骤安装 Hexo Next 主题： 1. 在...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值