The left menu is your app’s slide-out drawer — the one that opens from the “hamburger” icon — and it’s your app’s secondary navigation. Your bottom tab bar holds the few most-used destinations; the left menu holds everything else: account links, settings, help pages, social links, and any extra buttons that didn’t make the tab bar’s five-button cut. Here’s how to add that menu to your app, fill it with buttons, and style its logo, icons, colors, and width.

Goal

Add the slide-out left menu to your app, control which buttons appear in it, and style its appearance — the top logo, per-item icons, text and background colors, and the menu width.

The Settings Menu (Left Menu) button is what renders the drawer (its content class — the internal type stored for each button — is mam_main_left_menu). It builds itself from a per-role button list, so whatever you see in the menu is exactly what you’ve placed there in the admin — there’s no separate “menu content” to write. The menu’s chrome — its logo, colors, width, and profile summary — comes from a set of app settings, not from the individual buttons.

Prerequisites

• A MAM Suite app with MAM Main active.
• Admin access to the Mobile App Manager.
• A rough idea of which destinations belong in the menu (Account, Settings, Help, social links, etc.). Reserve the bottom tab bar for the few most-used areas and let the left menu hold the rest.
• Any buttons you want to place in the menu already created. If you haven’t created them yet, see Recipe: Add a button first — you can create them as you go, but it’s smoother to have them ready.

Steps

1. Place a Settings Menu (Left Menu) button so the drawer can open

A button with content type Settings Menu (Left Menu) is what opens the drawer — it’s what renders the hamburger icon and slides the menu out when tapped.

Create a button (Mobile App Manager → Buttons → Add a Button) and choose Settings Menu (Left Menu) as its content type. There’s nothing to configure on this button itself — its detail form simply reads “No settings required,” because the menu’s contents and styling come from the left-menu button list and the app settings instead.

Then place that button wherever you want the hamburger to appear — typically the navigation/header area of your home screen or main screens, so the drawer stays reachable from anywhere. See Recipe: Add a button for how to place a button on a screen.

2. Choose the role you’re configuring

The left menu is built per role — its button list is resolved through apply_filters('mam_app_settings_get_buttons', false, $role, 'left'), so each role can see its own set of menu entries. If your app shows different navigation to different audiences (say, an anonymous visitor versus a signed-in member versus staff), use the role selector at the top of the Buttons page and configure each role on its own. If everyone sees the same app, just configure the default role.

3. Add the buttons that should appear in the menu

In the Buttons admin for the selected role, add the buttons you want in the drawer, then place them in the left-menu list under Mobile App Manager → Navigation → Left Menu by dragging the button into the menu. Any button content type can go in the left menu — Web URL, WP Post Category, Map, Login/Logout, Favorites, a contact form, and so on.

A few menu-specific entries are worth knowing about:

• Left Menu Separator — a visual divider you can drop between groups of items. It renders either as a thin horizontal rule or as a labeled section header (for example, “Account”, “Browse”, “Help”). It has no tap action; it’s purely for organizing the list.
• Social links — if your menu includes social links, the Keep Social in App setting controls whether tapping one opens inside the app’s web view or hands off to an external browser/social app.

The order of the items in the list is the order they appear in the drawer, top to bottom. Put the most important destinations first.

How a button gets hidden: When the app builds the menu, it skips any button whose content type is an off-directory type — one whose internal vc_type is offDirectory (data-only content types that were never meant to render as navigation). Those entries simply never show up in the drawer. To hide a normal button instead, remove it from the left-menu list for that role.

4. Turn on the top logo (optional)

To show a logo or banner at the top of the drawer:

• Turn on Has left menu logo (has_left_menu_logo).
• Set Top image Image URL (home_left_menu_top_image) to the image you want — usually your logo or a banner.
• Set Top image Image Aspect Ratio W/H (home_left_menu_top_image_aspect) to the image’s width ÷ height so it displays without distortion.
• Optionally set Bottom Image (home_left_menu_bottom_image) for an image pinned to the bottom of the drawer.

5. Show the signed-in user at the top (optional)

The drawer can greet the signed-in user:

• Show Username on left menu if logged in? (home_screen_left_menu_show_user_name) — shows the logged-in user’s name at the top of the menu.
• Show User Profile Summary in Left Menu (left_menu_show_profile_summary) — shows a fuller profile summary (such as name and avatar) at the top.
• Username Text Color (left_menu_profile_text_color) — the color of that username text (default #000000).

These only matter once someone’s actually signed in.

6. Turn on per-item icons (optional)

• Use Left Menu Icons (left_menu_icons) — when on, each menu item shows an icon next to its label. The icon for each item comes from that button’s configured icon.
• Icon Color (left_menu_icon_color) — the tint applied to those icons (default #000000).

7. Style the colors

The drawer’s colors are set with these app settings (not per button):

8. Set the width and the back button (optional)

• Use Fullwidth Left Menu (left_menu_full_width) — turn this on and the drawer slides out to fill the whole screen instead of a partial-width panel. Leave it off for the standard look, with part of the screen still visible behind the drawer.
• Show back button on Left Menu (show_left_menu_back_button) — turn this on and the drawer shows a back button.

9. Save

Save the Buttons page and the app settings — both the menu’s button list and its styling are stored against the role you were editing.

Verify it

1. Open your app in the Previewer (or a test build) as the role you configured.
2. Tap the hamburger icon and confirm the drawer slides out.
3. Confirm the items appear in the order you set, with the labels (and icons, if you enabled them) you expect.
4. Tap each item and confirm it goes where you expect. Separators should not respond to taps.
5. Confirm the logo, colors, and width match your settings.
6. If you configured more than one role, switch accounts/roles and confirm each role sees its own menu.

Tips and gotchas

• The hamburger needs a Settings Menu (Left Menu) button. Styling and listing buttons alone won’t make a drawer appear — something has to open it: the Settings Menu (Left Menu) button placed on your screens.
• Per-role means per-role. The menu’s button list and its styling toggles are all scoped to the role you’re editing. If an item “won’t show up,” check that you’re on the right role.
• Colors are app-level, not per-button. Unlike a regular button, the drawer’s background, text, and icon colors come from the left_menu_* app settings, so they stay consistent across every item in the menu.
• Icons only show when icons are on. Setting a button’s icon does nothing in the drawer unless Use Left Menu Icons is turned on.
• Profile and username options need a signed-in user. The username and profile-summary toggles have no visible effect for anonymous viewers.
• Social link behavior is its own setting. Whether social links open in-app or hand off to an external app comes down to Keep Social in App, separate from the link buttons themselves.

Related

• Recipe: Add a button — how to create a button, configure it, and place it on a screen, the tab bar, or the left menu.
• Set up the bottom tab bar for your app — the other half of your app’s navigation; reserve the tab bar for the few most-used destinations and let the left menu hold the rest.
• Content class: Settings Menu — the developer-level view of how the mam_main_left_menu class builds the drawer from the per-role button list.
• Content class: Left Menu Separator — the divider/section-header entry for organizing the menu.
• Hook: mam_app_settings_get_buttons — the per-role, per-location ('left') button list the menu is built from.

What’s next

• Group related items with Left Menu Separators and labeled section headers.
• Add role-specific entries (for example, an account/subscription link for members, a staff tools section for staff).
• Match the drawer’s colors to your app’s overall brand colors so navigation feels consistent.