Edit A Menu Item

Table of Content

1. 1. Edit A Native WordPress Menu Item
   1. Why SVG Icon only?
2. 2. Edit Mortar Menu’s Childless Menu Item
3. 3. Edit Mortar Menu’s Parent Menu Item

1. Edit A Native WordPress Menu Item

If you show a native WordPress Menu, Mortar Menu supports the Mega Menu template from Bricks. Besides that, there are settings to insert an icon (SVG code only) and a featured image.

Why SVG Icon only?

You may ask why don’t support CSS classes. The reasons are:

• Performance: CSS classes require font stylesheet. Loading a whole stylesheet file of an icon font library (FontAwesome, Themify…) just to show some menu icons is not worth it. Inline SVGs are much more better for performance.
• Customization: Better and easier to insert your own custom icons.

Make sure to use secure SVG code from reliable sources like FontAwesome, Bootstrap Icons.

2. Edit Mortar Menu’s Childless Menu Item

When clicking on a Childless Menu Item, your screen may look like this:

Mortar Menu supports common coponents for a menu item such as: Label, Icon, Badge and Featured Image.

Currently, Featured Image works inside Fullscreen Menu, Horizontal Menu and Vertical Menu layouts only.

3. Edit Mortar Menu’s Parent Menu Item

Besides the components of a Childless Menu Item, a Parent Menu Item supports Submenu:

You can nest any elements inside the Submenu. Make sure to enable Mega and add a Container first:

Or even use the Query Loop to query custom menu items:

Some notes when editing a Submenu:

1. Make sure to enable Mega and wrap content inside a Container element when building a Mega Submenu. Else, it won’t be rendered correctly.
2. To create a Normal Submenu, just add menu items into the Submenu element. No need to enable Mega or add a Container.
3. When enable Mega, you will see a “Slide Templates” control. This control is to add slides into a Submenu of a Dock menu (using the Dock Menu layout - you can learn about this layout on the Menu Layouts page).