Messenger Storefront (In-app Mini App)

Turn your Facebook Page into a full in-app storefront. Build a polished, multipage product catalog — with photos, videos, themed pages, an AI assistant per product, and lightweight order-taking — that opens inside Messenger the moment a customer taps the “Open Storefront” button on your Page’s Persistent Menu. No app store, no separate website, no checkout to manage. Just a tap, and your customer is browsing.

Free on every plan, including the trial. Built in the same visual drag-and-drop composer as the Telegram Storefront — same 11 block types, same 6 themes, same per-product AI chat, same lightweight order CTAs — at Integrations → Facebook Page → Configure mini app.

What you can build

Same shapes as the Telegram Storefront — every block type and theme ports over:

• Boutique storefront — hero banner + product grid + per-product chat + order inquiry form. Orders land in your inbox; a teammate replies from there.
• Restaurant menu — multipage (Starters / Mains / Drinks) + photo gallery + cart-mode checkout with a delivery address field.
• Course or service catalog — product cards with a Video intro, testimonials, and a “Book a call” CTA back to the bot.
• Brochure Page — hero + about + gallery + contact card + FAQ. No products at all. A polished mobile brochure that lives inside your Facebook Page.
• Lead-capture landing — one page, one hero, one form, one CTA. The lightest possible Messenger funnel.

Why it matters

• Customers never leave Messenger. No app install, no domain to remember, no checkout flow to abandon. The storefront opens in Messenger’s WebView and inherits the user’s theme and language.
• One tap from your Page’s chat. A single “Open Storefront” entry is auto-seeded into the Persistent Menu the moment you connect your Page — no Meta Business Suite config, no app review, no webhook wiring.
• AI-native product chat. Per-product chat is scoped to documents you attach to that product — the assistant answers “what’s the return policy on this dress?” without leaking facts from other products.
• Order handoffs to a real human. Lightweight order forms (inquiry or cart mode) land in your Inbox as a structured handoff, with the customer’s Messenger DM held open for follow-up.
• Free on every plan. Trial cap (5 pages / 25 blocks per page / 100 product docs) lifts on every paid plan. Pricing is per-org — adding a second Facebook Page doesn’t change your tier price.

At a glance

• Multipage, drag-and-drop. End users tap the hamburger (top-left) to switch pages. If you publish one page, it loads full-screen.
• 11 block types — Hero, Product card, Product grid, Carousel, Gallery, FAQ, Testimonial, CTA back-to-bot, Contact, Video, Rich text. (Cart is an auto-injected virtual page when you use cart-mode order CTAs — no separate “Cart review” block.)
• 6 themes with per-block style overrides.
• Draft → Publish lifecycle with one-click revert to the last published snapshot.
• Auto-seeded Persistent Menu — single “Open Storefront” button, editable label, locked action.
• Outer-chat fallback — blocks project to in-chat Generic Templates, Quick Replies, and image carousels for older Messenger clients.
• Built-in Help Center — a pinned FAQ surface, always one tap away. Same panel as Telegram.
• No payments, no inventory, no shipping — this is a polished catalog + lead-capture surface, not a full e-commerce stack.

How customers find it

Every connected Facebook Page exposes a Persistent Menu to anyone messaging it. We auto-seed a single entry — “Open Storefront” (default label, editable to anything 1–32 characters in any language) — that opens your storefront.

The launch flow is a postback:

1. End user taps “Open Storefront” on the Persistent Menu.
2. The bot receives a BROWSE_SHOWCASE postback, mints a one-time launch token, and sends back a Button Template with a single “Open Storefront” CTA.
3. End user taps the button → Messenger opens a WebView → storefront loads.

That’s one extra tap compared to a “tap menu → instant WebView” approach. We use the postback model because the direct-WebView model silently fails on a meaningful cohort of older Messenger clients (Meta SDK error 2071011). With postback-via-Button-Template, every client we’ve tested works — and the launcher token is single-use, HMAC-bound, and lives in the recipient’s DM, so there’s no exposure to share-link abuse.

Prerequisites

• A connected Meta (Facebook) integration. The storefront rides on top of it — there’s no separate integration to add.
• (Optional) Product images, product copy, FAQ entries, and knowledge-base documents to wire into per-product chat.

Quick start (5 minutes)

The shortest path from “I connected a Page” to “my first customer is browsing”:

1. Go to Integrations → your Facebook Page → Configure mini app. The composer opens in Draft state.
2. Click ”+ Add page” in the left rail. Name it (e.g. “Home”).
3. Add a Hero block — headline, subheadline, a 16:9 background image (drop a photo, the cropper opens automatically).
4. Add a Product card — name, price, 1:1 image, short description. Toggle on AI chat and attach a doc (a PDF spec sheet, your shipping policy — anything from your KB).
5. Add an Order CTA on that product — pick inquiry mode, choose form fields (name is always required).
6. Click Publish. We auto-publish the Persistent Menu — your Page’s menu now shows “Open Storefront” to every visitor.
7. DM your own Page from a different Facebook account. Tap the menu → “Open Storefront” → “Open Storefront” (the Button Template). Tap your product. Tap “Ask a question.” Tap “Order this.” Submit. You’ll see the handoff land in your Inbox within seconds.

That’s the minimum-viable Messenger Storefront. Add more pages, more products, themes, videos, and a Help Center as you grow.

The composer

The composer is the same editor as the Telegram Storefront — see Telegram Storefront: The composer for the full tour (3-pane layout, draft/publish lifecycle, image cropper, tier limits). The only channel-specific surface is the Distribute tab.

The Distribute tab (Messenger)

The composer’s right-most tab is Distribute. On Messenger it shows:

Outer-chat fallback for older clients

For end users on Messenger clients that can’t open a WebView at all, the storefront still works — it projects into the chat thread itself. The Send API adapter at outer_chat_adapter.py maps each of the 11 block types into a Messenger-native primitive:

• Hero / Product card / CTA back-to-bot → Generic Template card
• Product grid / Carousel → Generic Template carousel (multi-card swipe)
• Gallery → image-sequence messages
• FAQ / Rich text → text messages with optional Quick Replies
• Testimonial / Contact → Generic Template card with action buttons
• Video → video attachment + caption

No broken UI, no dead ends. The same product list, the same order CTAs — just rendered as in-chat templates.

Recovery flow for end users

If an end user lands in a WebView that can’t bootstrap auth (very rare — only on a few very old clients), the storefront shell shows a sticky top-of-screen banner linking back to your Page at m.me/{page_id}?ref=BROWSE_SHOWCASE. One tap returns them to the Messenger thread; tapping “Open Storefront” again gets them a fresh launcher token and they’re back inside.

This is automatic — there’s no admin setup required.

Orders & handoffs

Order CTAs work the same way as the Telegram Storefront — inquiry mode or cart mode, same configurable form fields, same instant “Got your order” DM, same Order Request Panel in the Inbox.

The only Messenger-specific difference: order handoffs land in the inbox with metadata.type == "messenger_mini_app_order" (Telegram uses mini_app_order). The inbox renders the same panel for both.

The 24-hour messaging window applies to follow-up messages: Meta only lets you message a user within 24 hours of their last inbound. The storefront launch postback resets the window, so the “Got your order” DM and any teammate follow-up land normally — but if the customer goes silent for >24 hours, you’ll need them to message your Page again before you can reply.

See Telegram Storefront: Orders and cart for the full order-flow walk-through (form fields, anti-spam limits, dedup window) — all shared with Messenger.

Auth model (for the curious)

You don’t need to think about this — the platform handles it. But if you’re curious:

• Public reads (/style, /showcase, /help-entries) are fully public, keyed by ?i={integration_id}. No cookie, no signed_request, no rate-limit on these — every cold-start client renders the storefront immediately.
• Write actions (/ask, /track, /product-chat/stream, /order-inquiry) require a session. Primary path: a messenger_mini_app_session httpOnly cookie minted from a one-time launch token (CHIPS-partitioned, so Messenger’s in-app browser doesn’t third-party-block it). Fallback: Meta’s signed_request HMAC for the rare client where the SDK still works.

That’s it. No customer ever sees a login prompt.

What it does NOT do

Same scope as the Telegram Storefront:

• No payments. Order CTAs are inquiry handoffs, not Checkout API or Stripe.
• No inventory tracking. Availability badges on product cards are free-text labels you edit manually (“Sold out”, “Pre-order”, “Last 3”).
• No shipping calculations / address validation. Delivery address is collected as free-form text.
• No customer accounts. Customers are identified by their Messenger PSID; there’s no login or signup flow.
• No Page comments or Page posts. This integration only handles Messenger threads and storefront launches.
• No Instagram DM storefront (yet). The same Meta integration covers Messenger only; Instagram DM is text-conversation only.
• 24-hour messaging window applies. See above.

Troubleshooting

”Open Storefront” doesn’t appear on my Page’s menu

1. Open the composer → Distribute tab → tap Publish to Messenger.
2. If you see a “Connect your Page” amber banner, complete that step first — the auto-seed needs Page-management permissions.
3. If the banner stays after a re-publish, disconnect and reconnect the integration. The post-connect auto-seed runs fresh.

Customer says the button doesn’t open anything

Almost always a stale Messenger client. The shell shows them a one-tap “back to chat” banner; they reopen the Page, tap “Open Storefront” again, and the next launcher token gets a fresh redemption.

Storefront opens but I can’t submit an order

Check that:

1. You’re inside Messenger (not the regular Facebook web wrapper).
2. The customer’s last inbound message to your Page was less than 24 hours ago (or they just tapped the launch button, which resets the window).
3. Your Inbox is showing — the order may have landed, but is filtered out by a search or status filter.

Auto-seed failed and Publish to Messenger button greyed out

You’re missing Page-management permissions. Go to Integrations → your Meta integration → Three-dot menu → Reconnect. The OAuth flow re-prompts you for the missing scope.

Important notes

• One storefront per Page: each Facebook Page has its own draft and published storefront — independent of other Pages in the same org.
• Pricing is per-org, not per-Page: adding a second Facebook Page does NOT change your tier price.
• Shared composer with Telegram: if you operate both channels, the same composer builds both — just open each integration’s “Configure mini app” link. Themes, blocks, and Help Center entries don’t cross-link, but the patterns transfer.
• Outer-chat adapter is automatic: you don’t configure it. Every block you publish projects into Generic Templates / Quick Replies / image carousels for the fallback path.