Navigation Bar navbar

Auto Hide

Configuration Option: navbar.auto_hide

Whether to automatically hide the navigation bar when scrolling the page.

Background Color

Color gradient effect

Left Side

Configuration Option: navbar.color.left

Right Side

Configuration Option: navbar.color.right

Transparency

Configuration Option: navbar.color.transparency

Link List

Configuration Option: navbar.links

Normal Menu

Effect:

Syntax:

navbar:
  links:
    Home: # 一级菜单栏名称
      path: / # 网址，可以为相对路径或者绝对路径
      icon: fa-regular fa-house # Fontawesome图标名称（可选）

To implement a menu that redirects to a third-party website when clicked on the navigation bar, simply fill in the value of path with the URL of the third-party website.

For example, configure a menu in the header navigation bar to redirect to the Google website:

navbar:
  links:
    Google: # 一级菜单栏名称
      path: https://www.google.com/ # 网址，可以为相对路径或者绝对路径
      icon: fa-brands fa-google # Fontawesome图标名称（可选）

Dropdown Menu Syntax

Effect:

Syntax:

navbar:
  links:
    About: # 一级菜单栏名称
      icon: fa-regular fa-user # Fontawesome图标名称（可选）
      submenus: # 二级菜单栏
        Me: /about # 二级菜单栏名称：网址
        Github: https://github.com/EvanNotFound/hexo-theme-redefine

Icon Configuration

Please visit Font Awesome  to search for icons and then copy the icon name.

Finally, write it inside the icon field.

Search

You need to install the hexo-generator-searchdb plugin.

Please execute the following command to install:

npm install hexo-generator-searchdb --save

Switch

Configuration Option: search.enable

Preload

Configuration Option: search.preload