The App Setup Wizard is the quickest path from a fresh MAM Suite install to a working app foundation. By the end of this tutorial, you’ll have chosen a home screen layout, arranged your bottom navigation, picked your brand colors, and previewed the result live on your phone — no code required. Everything you pick here is saved as a real app setting, so the app you finish with is the app you configured.
This tutorial walks straight through, in one sitting. You’ll move through all six steps in order: Welcome, Home Screen Setup, App Navigation, Colors and Branding, App Previewer, and Next Steps and Resources.
What you will have at the end
- A home screen layout selected from three pre-built options.
- A configured bottom navigation bar with the tabs you want, in the order you want.
- A light and a dark brand color applied across your app.
- The Previewer app on your phone, loaded with your live content.
- A clear sense of where to go next in the Mobile App Manager dashboard.
Prerequisites
Before you start, gather the following.
- A WordPress admin account on the site running MAM Suite. The wizard requires the
manage_optionscapability, so a standard administrator account is what you need. - GeoDirectory installed and active. This is the most important prerequisite. Until a supported content plugin is active, the wizard shows only its Welcome step and prompts you to add the integration. With GeoDirectory active, all six steps unlock. The current core integration is GeoDirectory (and GeoDirectory Events).
- The MAM GeoDirectory plugin. If it’s not already installed, the wizard’s Welcome step will help you add it — it’s the bridge that connects your GeoDirectory listings to the mobile app.
- A phone or tablet (iOS or Android) for the previewer step, with a camera able to scan QR codes.
- Optional: some published GeoDirectory listings. You don’t need any to run the wizard, but if you have listings, the preview will look more like your finished app. The Welcome step reports how many listings it found.
If GeoDirectory isn’t active yet, install and activate it first, then come back to the wizard. You can open the wizard any time from Mobile App Manager in the WordPress admin menu, or pick up where you left off from the reminder notice that appears until setup is complete.
Steps
Step 1 — Welcome
Open the App Setup Wizard to get started. The first step, Welcome to the App Setup Wizard, gives you the lay of the land: the wizard builds your app’s foundation, working alongside the settings under MAM (Mobile App Manager) that shape how the app looks and behaves. It also lays out the core promise behind all of this — your app pulls content automatically from your WordPress site, and when you update content on the website, those changes flow through to the app with no extra steps.
What you see next depends on which plugins you already have.
- If GeoDirectory is active, the step confirms it is installed and reports how many GeoDirectory listings it found on your site. If the MAM GeoDirectory integration plugin is not yet installed, you’ll see an Install MAM GeoDirectory Plugin button. Click it and wait for the “Processing…” indicator to finish. The Next Step: Set Up Your Home Screen button stays disabled until MAM GeoDirectory is installed.
- If no supported plugin is active, the wizard explains which integrations are supported (GeoDirectory and GeoDirectory Events as core; WooCommerce, Business Directory, and various data-collection apps as well) and offers a Contact Us link instead of continuing. Install GeoDirectory, then reload the wizard.
Once MAM GeoDirectory is installed, click Next Step: Set Up Your Home Screen to continue.
Step 2 — Home Screen Setup
The Home Screen step is where you decide the first thing your users see when they open the app. You’re offered three pre-built layouts:
- Layout 1: Classic Directory
- Layout 2: Modern Carousel
- Layout 3: Events and Venues
Click a layout thumbnail to select it — your choice saves immediately, and the layout you picked gets highlighted. This choice also sets the preview image for the next two steps, so the navigation and branding previews will match whatever layout you land on here.
You’ll be able to refine the home screen later in the App Settings Manager, turning on features like GeoFilters, tag clouds, filter bars, and date selectors. For now, just pick the layout closest to what you want and click Next Step: Configure App Navigation.
Step 3 — App Navigation
The App Navigation step is where you set up the tabs in your app’s bottom navigation bar. Arrange tabs on the left, and watch a live preview of the layout you chose in Step 2 on the right.
- The Home tab is fixed and locked — it always appears first and can’t be removed or reordered.
- The other tabs (such as Deals, Map, Events, and Favorites) can be edited and reordered. Edit a tab’s label by typing in its title field; the change saves automatically. Drag a tab by its handle to reorder it, and the new order saves automatically.
- Use the checkbox on each tab to include or exclude it.
Some tabs need an extra plugin before they’ll work. Want Deals? The step offers an Install MAM Special Offers Plugin button. Want Events? Look for an Install GeoDirectory Events Plugin button. Already-installed integrations show an “is installed” label instead. Install whichever features you want, waiting for the “Processing…” indicator each time.
When your navigation looks right, click Next Step: Colors and Branding — your navigation order and tab settings are already written into your app configuration.
Step 4 — Colors and Branding
In the Colors and Branding step, you’ll choose two main colors for your app:
- A Light color — used for fonts and the active icon. The default is white (
#ffffff). - A Dark / Highlight color — used for headers, buttons, and highlights. The default is a red (
#E70000).
Pick each color with its color picker — your selection saves the moment you change it, and adjusting the dark color re-colors the preview on the right to show the effect on your chosen layout. (You’ll see a brief “wait” cursor while the recolored preview loads; that’s normal, not a glitch.)
These two colors give your app a coherent starting palette, and you can fine-tune every individual color later in the App Settings Manager. When you’re happy with the look, click Next Step: Get the App Previewer.
Step 5 — App Previewer
The App Previewer step puts your app on a real device, so you can see your work live instead of imagining it. It shows two QR codes:
- Download QR code — scan this to install the WP Mobile App Manager Previewer app from the App Store or Google Play onto your phone or tablet.
- Load content QR code — after installing the Previewer, scan this second code with your phone’s camera to pull in your site’s data and see your content live inside the app.
Install the Previewer first, then scan the second code. Within a moment you should see your home screen, navigation, and colors exactly as you set them up in the previous steps — and if you’ve published GeoDirectory listings, they’ll show up in the content feed.
Once you’ve confirmed your app looks right on the device, click Final Step: Next Steps and Resources.
Step 6 — Next Steps and Resources
The final step, Next Steps and Resources, confirms your basic app structure is ready and points you toward where you continue building. It highlights five directions:
- Add more features — open the App Settings Manager to enable advanced tools like GeoFilters, reviews, and Event features.
- Refine your branding — update your colors anytime, or fine-tune icons and layouts in the App Settings Manager.
- Preview again anytime — revisit the App Previewer step to re-scan the QR codes; the Previewer always shows your latest changes.
- Publish your app — when you’re ready, the MAM team can submit your app to the App Store and Google Play. Start from the Publish App page.
- Learn more — browse the documentation and knowledge base for guides on every feature.
Reaching this step marks the wizard complete, so the setup reminder notice stops appearing for good. Click Finish & Go to the MAM Dashboard to land back in your Mobile App Manager dashboard.
What’s next
You’ve now got a working app foundation — layout, navigation, branding, and a live preview all in place. From here:
- Open MAM → App Settings Manager to enable and tune individual features on each screen.
- When you want to add app screens for specific plugins (for example, a Contact form or Special Offers), configure them under App Setup and they’ll appear alongside the navigation you set up here.
- When the app is ready for stores, head to Publish App to start the submission process with the MAM team.
Want to revisit any step? You can re-run the wizard any time from the Mobile App Manager menu.
