In this article, we will show you how you can customize the hamburger 🍔 icon (Mmmm... delicious!) located in the Overlay Menu. More about the navigation system and Overlay Menu here.
Setting a custom hamburger icon
- Open the Semplice admin menu and click "Customize" > "Navigations".
- Choose the navigation bar where you want to add a custom hamburger icon.
- Go to the 'Menu Styling' tab.
- Make sure 'Burger on mobile' is turned on.
- To see the changes, select the 'Hamburger' option under 'Change Preview & Settings to'.
- Click the 'Hamburger' section and choose 'Custom' type.
- Now you can set a custom hamburger icon for both the open/closed states.
For the best results, we recommend using SVG Format.
Setting a custom hamburger icon as a text
- Follow the first 5 steps of the previous guide: Open the Semplice admin menu, click "Customize" > "Navigations", choose the navigation bar, and go to the 'Menu Styling' tab.
- Under the 'Hamburger' section, select 'Text' as the type.
- Enter labels for both the open and closed states of the hamburger icon.
- Now you can change the formatting of the text, such as font, size, letter spacing, colors, underline, and alignment.