Menu Management

90 vues Markdown

Your site's header, footer and mobile menus are built here: items, order, submenus and wording in every language.

Opening the Screen

Open Menu Management under Site Management in the menu: {admin}/manage-website/menus The address can name the menu you want open: {admin}/manage-website/menus?type=footer

What Is on the Screen

Menu Structures The four menu groups, listed on the left: Header, Footer, Mobile and Sidebar. Each keeps its own items and you edit one at a time. Unsaved changes survive a switch.
Current Menu Items The items of the chosen menu, in the order visitors see them. Each row shows the title, with the target address beside it once the item has a page or a custom URL. The drag handle sits on the left, the edit and delete buttons on the right.
Collapse All Folds every submenu away so a long menu fits on one screen. The same button then reads Expand All.
Save Changes At the foot of the list, and disabled until you change something. Nothing is saved before you click it.
Row badges Pending marks a new item, Edited a changed one, Deleted one that is on its way out. All three last until you save. Mega marks an item that carries mega menu content.

Fields

The window has one tab per site language. Title, address, description and badge text are asked on every tab. The rest sit on the first tab and count for all languages.

Page Selection What the item opens: the home page, your own pages, product groups, categories and products. The list also carries blog, news, reference, knowledge base and contract content. Contact, cart, sign-in and sign-up pages and the client area sections are on it as well. A closed product group or a closed system has no targets on the list. Choosing a page fills the empty title boxes with the page name. Pick Custom URL for an address of your own.
Custom URL The address the item opens when Page Selection is left on Custom URL. Asked per language, so a language can point somewhere else. A chosen page wins over this box.
Menu Title The text visitors read in the menu. Fill it on every language tab.
Description Optional. A short line under the title in dropdown menus. Per language.
Icon Code Optional icon class before the title, such as bi bi-house. Bootstrap Icons and Font Awesome classes both work, and one icon serves every language. The icon appears on dropdown rows and in the mobile menu, not on the top row of the desktop menu.
Badge Text Optional short word beside the title, such as NEW or POPULAR. A language whose box you leave empty shows no badge. The badge appears only on the rows inside a dropdown.
Badge Icon The second box under Badge Text. An optional icon class in front of the badge text, such as bi bi-fire.
Badge Background Color The left colour picker beside Badge Text. Red until you change it.
Badge Text Color The right colour picker. White until you change it. The two colours and the badge icon are shared by every language.
Open in New Tab Under Options. Ticked, the link opens in a new browser tab. Off by default.
Enable Mega Menu Opens the HTML area on every language tab. Off by default, and unticking it clears what you wrote there.
Mega Menu HTML Content The wide panel that opens under the item. Bootstrap classes and your own HTML are both allowed. Per language.

Tasks

Add a menu item

  1. Pick the menu you are building on the left, then click the Add Menu Item button at the top right.
  2. In the window choose a page under Page Selection, or pick Custom URL and type the address.
  3. Write Menu Title on each language tab, then click the Add Menu Item button at the foot of the window.
  4. The row appears at the end of the list with a Pending badge. Click Save Changes and the item is stored in the menu.

Reorder items and build a submenu

  1. Drag a row by the handle on its left to its new place in the list.
  2. Drag a row to the right and the row above opens a submenu and takes it in. Where the row above already has a submenu, drag your row into that open submenu list instead.
  3. Drag a submenu item to the left and it moves up one level. The menu nests three levels deep at most.
  4. Click Save Changes. The new order shows at once on a theme that reads this menu.

Edit or remove an item

  1. Click the pencil button on the row, change what you need and click Update Menu Item. The row is marked Edited.
  2. To remove a row, click its bin button and confirm in the small window that opens. The row is marked Deleted and the pencil becomes an undo button.
  3. Click Save Changes. Your edits and removals are applied together.

Give an item a mega menu

  1. Open the item and tick Enable Mega Menu under Options.
  2. Write the panel's HTML in the Mega Menu HTML Content box on each language tab.
  3. Close the window with Update Menu Item, then click Save Changes. The row now carries a Mega badge.

Things to Watch

Nothing is saved until you click Save Changes

Adding, editing, deleting and reordering wait in the list as badges. Leave the page unsaved and they are gone; the browser warns you first.

The theme carries the menu to the site

The theme decides what reaches the site. One installed theme writes its own navigation, so nothing you build here arrives in it, and no theme shows the Sidebar group. If the site does not change, check your active theme first.

Deleting takes the submenu with it

Removing a row removes the items nested under it as well. Until you save, the undo button takes it back. After saving, the item and its text in every language are gone for good.

Walk every language tab

Title, address, description and badge text belong to one language each. A tab you skip stays empty for that language, and the item reaches those visitors without wording. Leave the title empty in the default site language and the row shows empty on this list as well.

Required Privileges

Opening the screen comes with site management access. Saving the menu - adding, editing, deleting and reordering alike - needs MANAGE_WEBSITE_OPERATION.

Cet article vous a-t-il été utile ?

Merci pour votre retour !

Besoin d'aide supplémentaire ?

Notre équipe d'assistance est disponible 24h/24 pour tout ce que vous ne trouvez pas ci-dessus.