# Pre-filling screens



**Warning:** **Embedded signup v2 will be deprecated on October 15, 2026.** Migrate your integration to [v4](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/version-4) before that date to avoid disruption. See [Versions](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/versions) for the full upgrade path.

If you know details about your customer's business, such as its name and address, you can inject this data into Embedded Signup. Injecting this data can pre-fill screens or bypass them altogether, reducing the amount of input and interaction required by your customers.

For example, here is the business portfolio screen, pre-filled with business's name, email address, website, country, and a pre-verified business phone number:

For the best experience, inject [business portfolio data](#business-portfolio-data), a [pre-verified number](#pre-verified-phone-numbers), and [phone profile data](#phone-profile-data). Injecting this data provides the best experience for your customer, as it:

* entirely pre-fills the business portfolio screen
* bypasses the WhatsApp Business account (WABA) selection and creation screens
* bypasses the business phone number selection and verification screens
* automatically sets the business phone number's profile information in the WhatsApp client

## Embedded Signup integration helper

The Embedded Signup Integration Helper provides a convenient way for you to create pre-filled data payloads and test their impact on the flow. To access the payload tool:

* Navigate to **App Dashboard** > **WhatsApp** > **Embedded Signup Builder**.
* Locate the **Embedded Signup Setup** section.
* Locate the **Embedded Signup Pre-fill** row.
* Click the **Edit pre-fill data** button.

## Injecting data

The `FB.login` function, which gets called when a business customer launches Embedded Signup, accepts an object as an argument. Use this object's `extras.setup` property to inject data:

```js
// Launch method and callback registration
const launchWhatsAppSignup = () => {
  FB.login(fbLoginCallback, {
    config_id: '<CONFIGURATION_ID>', // your configuration ID goes here
    response_type: 'code',
    override_default_response_type: true,
    extras: {
      setup: {
        business: {
          // Business portfolio data goes here
        },
        preVerifiedPhone: {
          // Pre-verified phone number IDs go here
        },
        phone: {
          // Phone number profile data goes here
        },
        whatsAppBusinessAccount: {
          // WABA IDs go here
        }
      },
      featureType: '',
      sessionInfoVersion: '3',
    }
  });
}
```

### Business portfolio data

You can inject the following business portfolio details into the business portfolio screen:

* business portfolio name
* business portfolio email address
* business portfolio website
* business portfolio country (as well as additional address details)
* business phone number

Alternatively, you can inject _just an existing business portfolio ID_, and Embedded Signup automatically injects the portfolio's existing details into the screen. Injecting just the portfolio ID can be useful if you want a pre-verified phone number to be associated with the customer's existing business portfolio.

Injecting business portfolio data will pre-fill the business portfolio screen and also cause Embedded Signup to skip the WABA selection and WABA creation screens.

Injecting business phone number data will pre-fill the [phone number addition screen](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/default-flow#phone-number-addition-screen):

Note that even if you inject data, the business customer can still edit this data using the **Edit** button, if they wish.

When a business customer completes the flow, Embedded Signup uses the business portfolio information you injected to create the business customer's business portfolio and WABA.

#### Business object syntax

The `business` object pre-fills the business portfolio screen. Use the following syntax:

```html
setup: {
  business: {
    id: <BUSINESS_PORTFOLIO_ID>,
    name: '<BUSINESS_PORTFOLIO_NAME>',
    email: '<BUSINESS_PORTFOLIO_EMAIL_ADDRESS>',
    website: '<BUSINESS_PORTFOLIO_WEBSITE>',
    address: {
      streetAddress1: '<BUSINESS_PORTFOLIO_STREET_ADDRESS_LINE_1>',
      streetAddress2: '<BUSINESS_PORTFOLIO_STREET_ADDRESS_LINE_2>',
      city: '<BUSINESS_PORTFOLIO_CITY>',
      state: '<BUSINESS_PORTFOLIO_STATE>',
      zipPostal: '<BUSINESS_PORTFOLIO_ZIP_CODE>',
      country: '<BUSINESS_PORTFOLIO_COUNTRY>'
    },
    phone: {
      code: <BUSINESS_PORTFOLIO_COUNTRY_CALLING_CODE>,
      number: '<BUSINESS_PORTFOLIO_PHONE_NUMBER>'
    },
    timezone: '<BUSINESS_PORTFOLIO_TIME_ZONE>'
  }
}
```

#### Business object parameters

| Placeholder | Description | Example value |
| --- | --- | --- |
| `<BUSINESS_PORTFOLIO_ID>`<br><br>_Integer or null_ | **Required if using an existing business portfolio, otherwise set to null or omit to create a new portfolio.**<br><br>Set to the business customer's existing business portfolio ID if you want to pre-fill the screen with data already set on the business portfolio, or if you want to associate a pre-verified phone number with this portfolio.<br><br>If set to a portfolio ID, Embedded Signup checks whether the business customer owns the portfolio.<br><br>If they own it, Embedded Signup injects its existing data into the flow and ignores all other business object properties.<br><br>If they do not own it, Embedded Signup injects the `business.name`, `business.email`, `business.website`, and `address.country` values, if they are **all** set. If **any** are not set, the flow will display the default business portfolio screen instead.<br><br>Set to `null` (or omit the `id` property entirely) if you want to create a new business portfolio based on injected `business.name`, `business.email`, `business.website`, and `address.country` values. | `2729063490586005` |
| `<BUSINESS_PORTFOLIO_NAME>`<br><br>_String_ | **Required if creating a new business portfolio.**<br><br>Business portfolio name.<br><br>If this name matches the name of an existing business portfolio owned by the business customer, the existing portfolio will be used instead (it will be treated as if you assigned the existing portfolio's ID to the `id` property).<br><br>This name will also be used as the WhatsApp Business account name, which is only visible in the WhatsApp Manager.<br><br>Maximum 100 characters. | `Wind & Wool` |
| `<BUSINESS_PORTFOLIO_EMAIL_ADDRESS>`<br><br>_String_ | **Required if creating a new business portfolio.**<br><br>The business's email address.<br><br>This information will appear in the **Meta Business Suite** > **Business portfolio** > **Settings** > **Business info** panel. | `support@windandwool.com` |
| `<BUSINESS_PORTFOLIO_COUNTRY_CALLING_CODE>`<br><br>_Integer_ | **Required if injecting a business phone number.**<br><br>Business phone number country calling code. | `1` |
| `<BUSINESS_PORTFOLIO_PHONE_NUMBER>`<br><br>_String_ | **Required if injecting a business phone number.**<br><br>Business phone number, without country calling code. | `6505559999` |
| `<BUSINESS_PORTFOLIO_WEBSITE>`<br><br>_String_ | **Required if creating a new business portfolio.**<br><br>The business's website URL.<br><br>This information will appear in the **Meta Business Suite** > **Business portfolio** > **Settings** > **Business info** panel. | `https://windandwool.com/` |
| `<BUSINESS_PORTFOLIO_STREET_ADDRESS_LINE_1>`<br><br>_String_ | The business's street address, line 1.<br><br>This information will appear in the **Meta Business Suite** > **Business portfolio** > **Settings** > **Business info** panel. | `1 Hacker Way` |
| `<BUSINESS_PORTFOLIO_STREET_ADDRESS_LINE_2>`<br><br>_String_ | The business's street address, line 2.<br><br>This information will appear in the **Meta Business Suite** > **Business portfolio** > **Settings** > **Business info** panel. | `Suite 1` |
| `<BUSINESS_PORTFOLIO_CITY>`<br><br>_String_ | The business's city address.<br><br>This information will appear in the **Meta Business Suite** > **Business portfolio** > **Settings** > **Business info** panel. | `Menlo Park` |
| `<BUSINESS_PORTFOLIO_STATE>`<br><br>_String_ | The business's state address.<br><br>This information will appear in the **Meta Business Suite** > **Business portfolio** > **Settings** > **Business info** panel. | `California` |
| `<BUSINESS_PORTFOLIO_ZIP_CODE>`<br><br>_String_ | The business's zip code address.<br><br>This information will appear in the **Meta Business Suite** > **Business portfolio** > **Settings** > **Business info** panel. | `94025` |
| `<BUSINESS_PORTFOLIO_COUNTRY>`<br><br>_String_ | **Required if creating a new business portfolio.**<br><br>Business address [ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) country code. | `US` |
| `<BUSINESS_PORTFOLIO_TIME_ZONE>`<br><br>_String_ | The business's time zone in<br>[UTC offset](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) format. | `UTC-07:00` |

#### Example business object

```js
setup: {
  business: {
    name: 'Wind & Wool',
    email: 'support@windandwool.com',
    website: 'https://windandwool.com/',
    address: {
      streetAddress1: '1 Hacker Way',
      streetAddress2: 'Suite 1',
      city: 'Menlo Park',
      state: 'California',
      zipPostal: '94025',
      country: 'US'
    },
    phone: {
      code: 1,
      number: '6505559999'
    },
    timezone: 'UTC-07:00'
  }
}
```

### Pre-verified phone numbers

You can inject a [pre-verified business phone number](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/pre-verified-numbers) ID into Embedded Signup, which will cause Embedded Signup to skip the [phone number addition](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/default-flow#phone-number-addition-screen) and [phone number verification](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/default-flow#phone-number-verification-screen) screens.

If you are injecting a pre-verified phone number along with business portfolio data (either creating a new portfolio or using an existing one), Embedded Signup pre-fills the [business portfolio screen](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/default-flow#business-portfolio-screen) with the pre-verified number:

If you are not injecting business portfolio data along with a pre-verified number ID, the number will appear in the [WABA selection screen](https://developers.facebook.com/documentation/business-messaging/whatsapp/embedded-signup/default-flow#business-asset-selection-screen):

#### PreVerifiedPhone object syntax

The `preVerifiedPhone` object injects a pre-verified phone number ID, which causes Embedded Signup to skip the phone number addition and verification screens. Use the following syntax:

```html
setup: {
  preVerifiedPhone: {
    ids: [
      '<PRE-VERIFIED_PHONE_NUMBER_ID>'
    ]
  }
}
```

Replace `<PRE-VERIFIED_PHONE_NUMBER_ID>` with a unique, pre-verified business phone number ID.

Note that although the `ids` value accepts an array of strings, if you include more than one pre-verified business phone number ID, only the first ID in the array will appear in the WABA selection screen.

#### Example preVerifiedPhone object

```js
setup: {
  preVerifiedPhone: {
    ids: [
      '106540352242922'
    ]
  }
}
```

### Phone profile data

You can inject the following phone number profile data. This data does not pre-fill any Embedded Signup screens, but Embedded Signup populates the business phone number's profile in the WhatsApp client with it, which is visible to WhatsApp users.

* Phone number profile display name
* Phone number category
* Phone number description

If you do not include this data, Embedded Signup sets the category to **Other**, and the business customer must set or edit their profile data on their own.

Your customers can do this in the [**WhatsApp Manager** > **Account tools** > **Phone numbers** panel](https://business.facebook.com/latest/whatsapp_manager/phone_numbers/) by selecting their business phone number and accessing the **Profile** tab. You can also provide a way for them to update it programmatically by using the [WhatsApp Business Profile API](https://developers.facebook.com/documentation/business-messaging/whatsapp/reference/whatsapp-business-phone-number/whatsapp-business-profile-api#post-version-phone-number-id-whatsapp-business-profile).

#### Phone object syntax

The `phone` object populates the business phone number's profile in the WhatsApp client. Use the following syntax:

```html
setup: {
  phone: {
    displayName: '<PHONE_PROFILE_DISPLAY_NAME>',
    category: '<PHONE_PROFILE_DISPLAY_CATEGORY>',
    description: '<PHONE_PROFILE_DISPLAY_DESCRIPTION>'
  }
}
```

#### Phone object parameters

| Placeholder | Description | Example value |
| --- | --- | --- |
| `<PHONE_PROFILE_DISPLAY_NAME>`<br><br>_String_ | **Required.**<br><br>Business profile display name, visible to WhatsApp users in the WhatsApp client (see screenshot above). | `Wind & Wool` |
| `<PHONE_PROFILE_DISPLAY_CATEGORY>`<br><br>_String_ | **Required.**<br><br>Business profile display category.<br><br>See the vertical field in the [GET /<WHATSAPP_BUSINESS_PHONE_ID>/`whatsapp_business_profile`](https://developers.facebook.com/documentation/business-messaging/whatsapp/reference/whatsapp-business-phone-number/whatsapp-business-profile-api#fields) endpoint reference for a list of possible values. | `APPAREL` |
| `<PHONE_PROFILE_DISPLAY_DESCRIPTION>`<br><br>_String_ | **Required.**<br><br>Business phone number profile description.<br><br>* Maximum 512 characters.<br>* Rendered emojis are supported; however, their Unicode values are not. Emoji Unicode values must be Java- or JavaScript-escape encoded.<br>* Hyperlinks can be included but will not render as clickable links.<br>* Markdown is not supported. | `Bespoke artisan apparel and lifestyle goods from upcoming designers.` |

#### Example phone object

```js
setup: {
  phone: {
    displayName: 'Wind & Wool',
    category: 'APPAREL',
    description: 'Bespoke artisan apparel and lifestyle goods from upcoming designers.'
  }
}
```

### WhatsApp Business accounts

If you are injecting a pre-verified phone number, you can also include a WABA ID. This will associate the pre-verified number with the existing WABA instead of with a new one that the business customer would be prompted to create as part of the flow.

#### WhatsAppBusinessAccount object syntax

The `whatsAppBusinessAccount` object associates a pre-verified phone number with an existing WABA, so it does not appear in any pre-filled screen. Use the following syntax:

```html
setup: {
  whatsAppBusinessAccount: {
    ids: '<WABA_ID>'
  }
}
```

Replace `<WABA_ID>` with a unique WABA ID.

#### Example whatsAppBusinessAccount object

This example associates a pre-verified phone number with an existing WABA.

```js
setup: {
  preVerifiedPhone: {
    ids: [
      '106540352242922'
    ]
  },
  whatsAppBusinessAccount: {
    id: [
      '432428883295692'
    ]
  }
}
```

## Examples

### New business portfolio, pre-verified number, and display profile

```js
// Launch method and callback registration
const launchWhatsAppSignup = () => {
  FB.login(fbLoginCallback, {
    config_id: '31602279155865',
    response_type: 'code',
    override_default_response_type: true,
    extras: {
      setup: {
        business: {
          name: 'Wind & Wool',
          email: 'support@windandwool.com',
          website: 'https://windandwool.com/',
          address: {
            streetAddress1: '1 Hacker Way',
            streetAddress2: 'Suite 1',
            city: 'Menlo Park',
            state: 'California',
            zipPostal: '94025',
            country: 'US'
          },
          phone: {
            code: 1,
            number: '6505559999'
          },
          timezone: 'UTC-07:00'
        },
        preVerifiedPhone: {
          ids: [
            '106540352242922'
          ]
        },
        phone: {
          displayName: 'Wind & Wool',
          category: 'APPAREL',
          description: 'Bespoke artisan apparel and lifestyle goods from upcoming designers.'
        }
      },
      featureType: '',
      sessionInfoVersion: '3',
    }
  });
}
```

### Existing business portfolio, pre-verified number, and display profile

```js
// Launch method and callback registration
const launchWhatsAppSignup = () => {
  FB.login(fbLoginCallback, {
    config_id: '31602279155865',
    response_type: 'code',
    override_default_response_type: true,
    extras: {
      setup: {
        business: {
          id: '2729063490586005'
        },
        preVerifiedPhone: {
          ids: [
            '106540352242922'
          ]
        },
        phone: {
          displayName: 'Wind & Wool',
          category: 'APPAREL',
          description: 'Bespoke artisan apparel and lifestyle goods from upcoming designers.'
        }
      },
      featureType: '',
      sessionInfoVersion: '3',
    }
  });
}
```