Recipe: Build an app end-to-end

Goal

Take a fresh WordPress site with mam-main installed and produce a published mobile app — branded, populated with screens and buttons, configured for push notifications, and submitted to both stores.


Prerequisites

  • WordPress 5.8 or later, admin access
  • mam-main installed and activated
  • A signed WPMAM enrollment (the site has been onboarded by Tiny Screen Labs and has a non-zero local-app-account_code)
  • iOS bundle id and Android package id reserved with Apple and Google
  • An APNs .p8 key + key id + team id (for iOS push)
  • A Firebase service-account JSON (for FCM v1 push)
  • App icon (1024×1024 PNG) and launch-screen images
  • Gravity Forms installed and licensed (required for any data-entry surfaces — contact form, registration, listings)

Steps

1. Confirm enrollment and account code

Open Mobile App Manager → Setup Wizard. The wizard checks that local-app-account_code is populated and that the WPMAM enrollment server agrees. If it doesn’t, contact Tiny Screen Labs support before continuing — the publish step at the end will fail otherwise.

See Recipe: Customer enrollment and account code for the moving parts.

2. Set app identity

Mobile App Manager → Publish Your App writes the bundle ids, app names, version numbers, build numbers, permission strings, and integration keys. These are frozen option keys (ios_pn_app_bundle_id, android_pn_app_bundle_id, local-app-ios-app-name, etc.) — once set and submitted to the stores, treat them as immutable.

See Recipe: Publish your app to iOS and Android for the field-by-field walkthrough.

3. Brand the app

Upload assets in Mobile App Manager → App Settings:

  • App icon (local-app-images-app-icon) and icon background (local-app-app-icon-bg)
  • Launch screens (local-app-images-launch-screen-1, local-app-images-launch-screen-2)
  • Theme colors (mam-theme-color-light, mam-theme-color-dark)
  • Form colors for any in-app forms

Image uploads route through MAM_App_Image_Manager which resizes server-side. Don’t upload paths directly into options; always use the upload UI.

4. Build the home screen

Mobile App Manager → Layout lets you compose the home-screen stack from layout sections (hero, horizontal scroller, list, etc.). Each section is keyed in mam-layout-settings.

The home-screen stack is per-role — admins, members, and anonymous viewers can each see a different home screen. Use Mobile App Manager → Roles to switch between them while editing.

5. Add buttons

Open Mobile App Manager → Buttons. Click Add a Button, pick a content type (Login, Map, Web URL, WP Post Category, etc.), name it, and save. The button is now selectable from any screen-composition surface.

See Recipe: Add a button for the per-content-type detail.

The button definition is stored in local-app-button-array* (frozen public contract — customer sites have years of accumulated configs serialized into this option).

6. Configure the tab bar

Mobile App Manager → Navigation → Tab Bar controls the bottom tab bar. Up to 5 tabs by convention; each tab is a button reference. Tab bar buttons can be enriched per-listing-detail-screen via the mam_main_add_tab_bar_item_{slug} filter — see Hook: mam_main_add_tab_baritem{slug}.

7. Configure push notifications

Mobile App Manager → Push Notifications:

  1. Upload your APNs .p8 key, paste the key id, team id, and bundle id.
  2. Upload your Firebase service-account JSON.
  3. (Optional) Upload a separate VoIP APNs cert if your app uses CallKit-style wakeups.

See Recipe: Configure push notifications.

⚠️ Credentials are stored plaintext today. Encryption-at-rest is a tracked hardening task. Don’t co-locate the customer’s WordPress admin with low-trust users.

8. Build forms and integrate Gravity Forms

For any data-entry surface (contact form, registration, listing submission, product inquiry):

  1. Build the form in Forms → Add New (Gravity Forms)
  2. Open Mobile App Manager → Forms — your form should appear in the list
  3. Configure per-field special handling and the per-form colors
  4. Tie the form to a button (form-targeted buttons are configured under the button’s settings)

See Forms manager overview and Form submission lifecycle.

9. Configure notifications

Mobile App Manager → Notifications → Settings lists every registered notification type — the four core types (welcome, lost password, signup verification, general PN) plus everything sibling plugins have registered via mam_notification_list.

For each type, toggle which channels (email, SMS, push) are enabled and edit the templates with replacement tokens (e.g., [passwordcode], [user_login]).

See Notification types registry.

10. Test on a device

Install the WPMAM Previewer app (TestFlight / Firebase distribution) and point it at your enrollment account code. Walk every screen, exercise login/logout, submit one of each form, fire a test notification (Notifications → Test Send) to your own user.

Common gotchas surfacing here: missing required fields, mis-targeted buttons, broken images (wrong asset path), or a content-class field schema you forgot to fill in.

11. Submit the app

Once tested, Mobile App Manager → Publish Your App → Submit Publish Request. This:

  1. Verifies local-app-account_code against WPMAM
  2. Builds a settings array (filtered through mam_fastlane_settings)
  3. POSTs to the WPMAM publish endpoint
  4. WPMAM’s CI runs Fastlane to build, sign, and submit to App Store Connect and Play Store

Build status is polled separately — the submit is fire-and-forget.

See Recipe: Publish your app to iOS and Android.


Verification

After steps 1–9 your site should:

  • Return a fully populated payload from wp-admin/admin-ajax.php?action=local_app_get_phone_data (test by curling it as your admin user; the response should be 50–200 KB of JSON)
  • Show every configured button in the Previewer app
  • Successfully send a test notification to your own user across enabled channels
  • Pass the Publish Your App → Verify Account Code check

After step 11 you should see a build-running indicator on the publish status panel, followed by a TestFlight / internal-testing build appearing in App Store Connect / Play Console within 30–60 minutes.


  • Plugin: mam-main
  • Recipe: Add a button
  • Recipe: Configure the tab bar
  • Recipe: Configure push notifications
  • Recipe: Customer enrollment and account code
  • Recipe: Publish your app to iOS and Android
  • Recipe: Customize onboarding
  • Forms manager overview
  • Notifications overview
  • Mobile JSON shape

Metadata

Field Value
Article type Recipe (Admin)
Plugin slug mam-main
Applies to plugin version 2.1.11+
Category Building Your App
Audience WordPress admin
Estimated time 60–120 minutes (excluding App Store / Play Store reviews)
Last verified 2026-05-02
Contents

    Need Support?

    Can’t find the answer you’re looking for? Don’t worry we’re here to help!