Creating a toggle in HTML has two basic requirements:
1. It must have the class shiftnav-toggle
2. It must have a data-shiftnav-target attribute set to the ID of the menu that should be toggled upon activation
Here’s an example of a toggle for the main ShiftNav
<a class="shiftnav-toggle" data-shiftnav-target="shiftnav-main"> Toggle Content </a>
This will create a link with the text “Toggle Content” that, when clicked, will toggle the Main ShiftNav open and closed.
By default, ShiftNav won’t add any styling to this link, but you can use classes from your theme (button or btn are common) to style the toggle as a button or however you like.
By default this toggle will appear at all viewport widths. Want it to appear only below the same breakpoint as the main toggle bar? Add the shiftnav-toggle-mobile class to the toggle bar element
<a class="shiftnav-toggle shiftnav-toggle-mobile" data-shiftnav-target="shiftnav-main"> Toggle Content </a>
Note that this visibility can be easily overridden by other CSS on your site, so if it is not working, check that you don’t have other CSS setting this to display:none;