Site logo

Archived topic

How can I customize a nav bar that only displays on mobile?

3 replies · Started by Broc on November 26, 2018

Viewing posts 1–4 of 4

Is there any step-by-step documentation showing how to do this?

I want to achieve something like this. Where there is a menu up top on mobile, but there's also a drop down menu beneath on the left.
https://i.imgur.com/51YtlIZ.png

Simplest method is to add a Navigation Menu Widget to the Top Bar Widget area.
Then use this CSS to hide it on tablet / desktop:

 @media (min-width: 420px) {
     .top-bar {
         display: none;
     }
 }

The Primary Navigation can set to be below header. That covers the basics i think

This archived topic is closed to new replies.