How to Configure the Navigation Menu
Primary Navigation
Adding Menu Items to the Navigation Menu
-
Go to your Blogger Dashboard > select the Layout menu.
-
Find the section titled Primary Navigation.
-
Click the edit button (pencil icon) on the Link List Gadget.
-
A Widget configuration pop-up will appear.
-
In the Title field, enter a title as desired (Optional).
-
In the Number of items to show in list field, leave it blank.
-
In the Sorting section leave the setting at the default value.
-
In the Link list section set as below:
- Click ADD A NEW ITEM
- In the Site name field, enter the menu title as you wish.
- In the Site URL field, enter the destination URL link.
- Once everything is set click the SAVE button next to it.
-
After everything is configured click the SAVE button.
-
Done
Adding Submenu Items to the Navigation Menu
-
Go to your Blogger Dashboard > select the Layout menu.
-
Find the section titled Primary Navigation.
-
Click the edit button (pencil icon) on the Link List Gadget.
-
A Widget configuration pop-up will appear.
-
In the Title field, enter a title as desired (Optional).
-
In the Number of items to show in list field, leave it blank.
-
In the Sorting section leave the setting at the default value.
-
In the Link list section set as below:
- Click ADD A NEW ITEM
- In the Site name field, enter the menu title as you wish.
- In the Site URL field, enter the hashtag
#
. - Create a new menu item again under the previously created menu and put
_
at the beginning of the title, for example_Submenu
. - In the Site URL field, enter the destination URL link.
- Once everything is set click the SAVE button next to it.
-
After everything is configured click the SAVE button.
-
Done
Adding Icons to Menu Items
-
You should visit the Material Design Icons website. There you can select different types of SVG icons, which will later be fetched and saved in the Navigation Menu.
-
Select one of the available icon menus, e.g. select the Plus icon menu.
-
Click on the
</>
icon button section to copy the SVG icon code and paste it in the Menu Item section. For example, like the code example below:<svg fill="currentColor" viewBox="0 0 24 24"><path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z"></path></svg> MENU ITEM NAME
-
Done