Audrey - Offscreen menu

The Audrey theme includes an offscreen menu that displays at the top right corner of your site. When the hamburger menu button is clicked, the contents of the offscreen menu area will appear.

Offscreen menu when closed:

Offscreen menu when opened:

How to Set Up the Offscreen Menu

Since the offscreen menu is widget-based, you can put  anything you want in it! A few ideas are an image and bio about yourself, a signup form, a navigation menu, or a search bar.

In the demo, the offscreen menu contains four widgets:

1. Navigation Menu: "Explore"

  1. Create a new menu at Appearance > Menus (further menu instructions here).
  2. Go to Appearance > Widgets.
  3. Drag a Navigation Bar widget into the Offscreen Menu widget area.
  4. Give the widget a title if you wish (in the demo, the title is "Explore").
  5. Select the menu you created. Save.

2. Navigation Menu: "On the Blog"

  1. Create a new menu at Appearance > Menus (further menu instructions here).
  2. Go to Appearance > Widgets.
  3. Drag a Navigation Bar widget into the Offscreen Menu widget area.
  4. Give the widget a title if you wish (in the demo, the title is "On the").
  5. Select the menu you created. Save.

3. Custom HTML widget: Social Media Icons

To add your social icons, drag a Custom HTML widget into the Offscreen Menu widget area. Add your social icons code to the widget and then save. 

4. Search

Drag a Search widget into the Offscreen Menu widget area. Save.

What if I don't want to use the offscreen menu?

No problem! Just remove all widgets in the Offscreen Menu widget area and the menu button will remove itself.