Insert Your Landing Page

Once you have added the Beans iD <script> to your site you will then be able to insert your embedded landing page. This can be done by pasting the below snippet into your page in the place you want your landing page to be embedded.

<beansid-landing-page
  slug="[SLUG]"
  territory="[TERRITORY_CODE]"
></beansid-landing-page>

INFOEnsure to replace the [SLUG] and [TERRITORY_CODE] with the slug and code that we will provide you at time of integration.You may have been given this in the format [SLUG]/[TERRITORY_CODE]. If this is the case, just extract the values and use them as shown above.

Setting width and height

You do not need to set the width and height of your embedded landing page, by default the width is set to 100% and the height to 720px. However, in the event you do need to adjust these values, the width and height can be easily configured by providing either px or % values as width and height attributes on the <beansid-landing-page> element itself. In the example below the width of the landing page is being set to 500px, and the height to 100%.

<beansid-landing-page
  slug="[SLUG]"
  territory="[TERRITORY_CODE]"
  width="500px"
  height="100%"
></beansid-landing-page>

NOTEA minimum height of 720px is enforced to ensure that all relevant content is visible to a user.

`<beansid-landing-page>`attributes

Attribute	Example(s)	Description
`slug`	`your-brand`	This is the unique identifier for your landing page and is specific to you. It is normally something in the format `brand-name` and will be provided to you at time of integration.
`territory`	`uk`	This is a 2 letter code which dictates which territory to load your landing page for. You can only use countries that you have asked us to set up. A full list of available countries can be found here.
`width`	`500px` or `100%`	This property controls the width of the embedded landing page. This can be set to a `px` or a `%` value.
`height`	`800px` or `100%`	This property controls the height of the embedded landing page. This can be set to a `px` or a `%` value. The landing page has an enforced minimum height of `720px` to ensure all the relevant content is always visible to a user.
`language`	`en-gb`	This property controls which language your landing page should display in. More information on overriding language can be found on the Overriding Language page.
`title`	`discount title`	This property controls what screen readers will read when describing the iframe.

Get Started

Verify your Customers

Track every Transaction

Check iD Status

Connect with your Customers

Language & Territories

Insert Your Landing Page

Setting width and height

`<beansid-landing-page>`attributes

​Setting width and height

​<beansid-landing-page>attributes

Setting width and height

`<beansid-landing-page>`attributes