Site Topbar – secondary menu [ 3 ]

Header – Topbar – secondary menu

Use cases

• Use this top bar with store header [ 2 ] or site headers [ 1,3 or 5 ] to add a secondary menu to the header upon request.
• The secondary menu should only include 3 – 4 links max.
• Don’t use this top bar on a header that already includes a secondary menu 

Component breakdown

Menu (secondary) – template uses a standard menu module aligned to the right.

• The menu module will appear empty unless you have a menu created and ready to select from the dropdown in the module – so make sure you create a menu using whatever shop-related links you want included in the secondary menu

Custom code

This top bar layout only uses custom CSS to style the secondary menu on mobile so that the links don’t stack, but remain inline since we will not be enabling responsive toggle.

.topsecmenu ul.menu {
    width: 100%;
    text-align: right;
}
.topsecmenu ul.menu > li {
    display: inline-flex;
}