侧边栏

侧边栏中包含多种配置,可通过修改主题_config.yml实现

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

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

位置

默认侧边栏放置在左侧,可修改sidebar -> position属性

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

头像

# Sidebar Avatar
avatar:
  # Replace the default image and set the url here.
  url: #/images/avatar.gif
  # If true, the avatar would be dispalyed in circle.
  rounded: false
  # If true, the avatar would be rotated with the cursor.
  rotated: false
  • url:图像地址。默认为NexT包下/source/images/avatar.gif,也可放置在站点路径/source/uploads文件夹内
  • rounded:是否显示为圆形图标
  • rotated:光标移动到图标是否旋转

进入myOctocat设计自己的图标吧!!!

社交链接

# Social Links
# Usage: `Key: permalink || icon`
# Key is the link label showing to end users.
# Value before `||` delimeter is the target permalink.
# Value after `||` delimeter is the name of FontAwesome icon. If icon (with or without delimeter) is not specified, globe icon will be loaded.
#social:
    #GitHub: https://github.com/yourname || github
    #E-Mail: mailto:yourname@gmail.com || envelope
    #Weibo: https://weibo.com/yourname || weibo
    #Google: https://plus.google.com/yourname || google
    #Twitter: https://twitter.com/yourname || twitter
    #FB Page: https://www.facebook.com/yourname || facebook
    #VK Group: https://vk.com/yourname || vk
    #StackOverflow: https://stackoverflow.com/yourname || stack-overflow
    #YouTube: https://youtube.com/yourname || youtube
    #Instagram: https://instagram.com/yourname || instagram
    #Skype: skype:yourname?call|chat || skype

NexT内置了多个网站的链接,取消想要添加的链接注释

  • key值是显示的选项名
  • ||前面表示链接的地址
  • ||后面表示图标,可通过Font Awesome库自定义

比如我的自定义

social:
    Github: https://github.com/zjZSTU || github
    CSDN: https://blog.csdn.net/u012005313 || book
    Email: mailto:zjzstu@gmail.com || envelope

邮箱设置参考请问怎么在侧边栏社交处添加邮箱呢

友情链接

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

修改Title和链接地址

内容列表

NexT根据Markdown文件的标题设置,会在侧边栏显示相应的目录

# Table of Contents in the Sidebar
# Front-matter variable (unsupport wrap expand_all).
toc:
  enable: true                                  # 是否开启目录
  # Automatically add list number to toc.
  number: true                                  # 自动增加列表数,比如`1.1 1.2 1.3`
  # 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

返回顶部

back2top:
  enable: true
  # Back to top in sidebar.
  sidebar: true
  # Scroll percent label in b2t button.
  scrollpercent: true
  • enable:默认为true。在右下角显示返回顶部图标
  • sidebar:默认为false。在侧边栏显示
  • scrollpercent:默认为false。是否显示进度