Navigation
Print Share Copy URL
Breadcrumb

Configure Menu

How to configure the menu in Hugo Brewm theme

Learn how to configure menus in the Hugo Brewm theme using either config.toml or menus[.lang].toml files.

  • identifier: Unique identifier for each menu item
  • name: Text shown in the menu
  • url: External link destination
  • pageRef: Link to internal pages
  • weight: Menu item ordering (smaller numbers first)
  • pre: Icon placement
  • post: Description for the link
  • parent: Parent menu item reference

Adding Icons

Add icons to your menu items with the pre parameter.

[[menu.main]]
    identifier = "github"
    name = "GitHub"
    url = "https://github.com/"
    pre = "github"

Here are all the supported list icons and their corresponding names that can be used when configuring your menu items:

Creating Nested Menus

Create dropdown menus by using the parent parameter:

[[menu.main]]
    identifier = "about"
    name = "About"
    pageRef = "/about"

    [[menu.main]]
        identifier = "about-author"
        name = "Author"
        pageRef = "/about/author"
        parent = "about"

Language Support

There are three ways to add multi-language support to your menus:

1. Using menu.[lang].[menuID]

In config.toml:

[[menu.en.main]]
    identifier = "about"
    name = "About"
    url = "/about/"

    [[menu.en.main]]
        identifier = "about-author"
        name = "Author"
        pageRef = "/about/author"
        parent = "about"

[[menu.id.main]]
    identifier = "about"
    name = "Tentang"
    url = "/tentang/"

    [[menu.id.main]]
        identifier = "about-author"
        name = "Tentang Penyusun"
        pageRef = "/tentang/penyusun"
        parent = "about"

2. Using Separate Menu Files

In menus.en.toml:

[[main]]
    identifier = "about"
    name = "About"
    url = "/about/"

    [[main]]
        identifier = "about-author"
        name = "Author"
        pageRef = "/about/author"
        parent = "about"

In menus.id.toml:

[[main]]
    identifier = "about"
    name = "Tentang"
    url = "/tentang/"

    [[menu.id.main]]
        identifier = "about-author"
        name = "Tentang Penyusun"
        pageRef = "/tentang/penyusun"
        parent = "about"

3. Using Front Matter in Markdown Files

in index[.lang].md _index[.lang].md or filename[.lang].md

---
title: "About Author"
menus: 
  main:
    indetifier: about-author
    parent: about
---

Giscus require Javascript and LocalStorage to be enable.