In this article I show how Sidr can be used to display Primary Navigation menu items in the left side when a hamburger menu icon font link is clicked.
I am using Genesis Sample as the active theme in this example.
Here's the flow:
Primary navigation bar appears in its entirety at screen width of 1024px (configurable) and above.
When screen width is 1023px and below, Primary navigation disappears and a hamburger menu icon appears in its place.
Clicking or tapping this hamburger menu icon will slide open a vertical section at the left side showing the Primary Navigation's menu items.
This vertical section can be toggled by clicking/tapping the Menu icon or swiping the screen in touch enabled devices.
