Migration Guide: Instagram (IX) to Meta Business Extension, v2

As one of our partners on Instagram Action Buttons, powered by the Instant Experiences (IX) integration, you should build the following Meta Business Extension (MBE), v2 requirements to retain your Order Food call-to-action buttons and Food Orders Stories sticker functionality:

  1. Authentication URL: To allow your businesses to onboard into MBE from Facebook or Instagram.
  2. Webhook: To receive prompt notifications each time one of your businesses installs or uninstalls MBE.
  3. Fire Pixel Events: To help your businesses better target new customers, increase transactions on your websites, and directly measure how the MBE integration is helping boost their outcomes.

Once you complete MBE development and testing, Meta will review and verify your integration. Once it is approved, your app will be available to public users.

Before You Start

  • If you haven’t yet, register as a Meta Developer to access our developer tools and create Meta apps.
  • If you haven’t yet, create a Meta app.
  • Create a test app from your live/production app and use it to perform all new development and testing.
  • Your apps (live/production and test) must be Business app type and owned by a Business Manager that is a verified business. Learn more about how to verify your business and how to add your apps to it.
  • Contact your Meta partner and share your app ids, so then they can grant you access to the MBE manage_business_extension capability and once approved you can start implementation work.

The name of your live/production app should represent your company branding (its app name and logo are going to be used when displaying it on our surfaces).

Set Up Your Integration via Developer Panel

The Meta Business Extension Developer Panel is a product in your Developer App Dashboard. Once your apps are granted with the MBE capability, you should use the Developer Panel to set up and validate your integration (including Authentication URL and Webhook endpoint).

Step 1: Add the MBE Developer Panel to your Facebook Developer Apps.

Step 2: On Setup tab, select Food and Drink as your only vertical, select Instagram Call to Action Button and Page Surface Call To Action Button as features and include all domains your app serves on Wilcard Domains card.

Step 3: After building Authentication URL, use Business Apps surface on Setup tab to get validated your URL (if any errors will be listed there), once you get the green check, you can go to Meta Business Apps to test end-to-end.

Step 4: After building Webhook, go and set it up on Webhooks product. If the setup is done as expected, you will get a green check on the Overview tab for Webhook Validated item.

Step 5: After firing required pixel events, complete Pixel Questionnaire (including a video to validate your pixel implementation).

Step 6: Help our team to verify and approve your integration by providing details in the Integration Review card on the Integration Review tab. This should include your platform's login credentials to login into your Authentication URL. Please add a screencast link showing the end-to-end onboarding experience and features you enabled.

Step 7: Once you have finalized the MBE implementation, complete the checklist in the Overview tab in the Developer Panel. Please fill out the forms for app details and integration review in the Integration Review tab. A click on the submit button will start the review process. Once your integration is approved, you will be able to launch your abb to public users over the Launch tab. Learn more about the Integration Review process and how to receive feedback and the current status from our team

Build Authentication URL

Business Apps, available across Meta surfaces, is where businesses can go to discover and connect to third-party business apps to easily get set up with business tools at low tech cost in order to grow and achieve their business goals.

MBE, v2 use an Authentication URL as a trusted channel for sharing user's business configuration (name, URL for the CTA, etc) between your platform and Instagram/Facebook.

Your Authentication URL needs to accept one GET query parameter redirect_uri and with this URL we recommend that you:

  1. Allow your users to log in to your platform and provide an option to register a new account on your platform (i.e. "signup") as well.
  2. If you support multiple businesses per account in your platform, surface a UI for the user to select which business on your platform they want to associate with their Facebook presence.
  3. Get the received redirect_uri query parameter and append to it the encoded extras object as a query parameter.
  4. Redirect users to the resulting URL (only if the received redirect_uri matches our regular expression).

Example — Use the extras object to configure a business and enable its Instagram profile CTA and Facebook Page CTA

{
  "setup": {
    "external_business_id": "<YOUR_ID_FOR_THE_BUSINESS>", //e.g. "foo-123"
    "timezone": "<BUSINESS_TIMEZONE>", //e.g. "America/Los_Angeles"
    "currency": "<BUSINESS_CURRENCY>", //e.g. "USD"
    "business_vertical": "FOOD_AND_DRINK"
  },
  "business_config": {
    "business": {
      "name": "<BUSINESS_NAME>"  //e.g. "Foo Business"
    },
    "ig_cta": {
      "enabled": true,
      "cta_button_text": "Order Food",
      "cta_button_url": "<BUSINESS_URL_FOR_CTA>"  //e.g. "https://partner-site.com/foo-business/order"
    },
     "page_cta": {
         "enabled": true,
         "cta_button_text": "Order Food",
         "cta_button_url": "<BUSINESS_URL_FOR_CTA>", // e.g. "https://partner-site.com/foo-business/order"
         "below_button_text": "Powered by <YOU>"
     }
  },
  "repeat": false 
}

Instagram "Food Orders" Stories sticker does not need to be included on your extras configuration, this feature is enabled by default if the Instagram CTA (ig_cta) feature is enabled for your businesses.

For details on the full implementation and testing, see Business Apps.

Build Webhook

After a user installs, updates or uninstalls your app via Business Apps, you will receive the details for that action via Webhook.

Setting up the Webhook requires you to:

  1. Create an endpoint on a secure server that can process POST requests from Facebook.
  2. Configure the Webhooks product in your app's App Dashboard to subscribe to the User object's fbe_install field.

When you receive a Webhook event for a new/updated installation, you must maintain a mapping of business_id to its pixel_id since pixel ID is unique for that business and you should use to fire required pixel events.

For details on the full implementation and setup, see Webhook.

Fire Pixel Events

Meta Pixel is an integral part of the Meta Business Extension, v2. We require that you accurately fire pixel the following standard events for every MBE-integrated business on your platform.

Required Events

  • For all the pages involved on the order food process: Fire PageView
  • After the order was placed: Fire Purchase

Optional Events

  • Fire AddToCart when a item is added to the order.

All standard events can be fired by calling the pixel's fbq('track') function, with the event name, and (optionally) a JSON object as its parameters. For example, purchase event requires currency and value included as a parameter:

fbq('track', 'Purchase', {currency: "USD", value: 30.00});

For details on the full implementation, see Fire Pixel Events.

Pixel Helper

We highly recommend that you install our Pixel Helper Chrome extension. The Pixel Helper provides extremely valuable feedback that can help you verify that your pixel is working correctly, especially when you start tracking conversions, where you can easily encounter formatting errors.

Integration Review and Launch

Once you have finalized the MBE implementation, complete the checklist in the Overview tab in the Developer Panel. Please fill out the forms for app details and integration review in the Integration Review tab. A click on the submit button will start the review process.

Integration Review is the process where Meta verifies your Meta Business Extension integration. Once your integration is approved, you will be able to launch your app to public users over the Launch tab. Learn more about this process.

After submitting your integration on the Integration Review tab in the Developer Panel, you will be able to view status, updates and feedback from our reviewers in the submission history section of the Integration Review card.

Our reviewers will provide detailed feedback. In case your app should get rejected, please complete all required steps before starting a new review process. You can do this by clicking on the resubmit button in the Integration Review tab.