Checkout 3.0
Extras flag

Extras flag

The extras object allows you to pass additional options and data to the Checkout 3 form. Currently the following options are supported:

PropertyData typeDescription
extraTermsAndConditionsstringStringified HTML markup of extra terms and conditions content. The provided markup is styled by default to match the styling of the Checkout 3 footer.

Note: The following HTML tags are not supported: <script>, <iframe>, <svg>
autoLoadShippingScriptbooleanIf true Checkout3 will inject and load the required shipping solution bundle on its own.
If false the required shipping bundle is not automatically loaded and its loading is left up to the integrator of the service.
For more information, see the section below.

Default value: true

extraTermsAndConditions

Allows the customer to provide a stringified HTML snippet containing additional terms and conditions that will be displayed under the newsletter subscription checkboxes.

Example

const extras = {
  extraTermsAndConditions:
    '<p>Our newsletters use cookies and similar technologies to measure the opening rate and our customers\' interests in our offers, to provide personalized advertisements and content marketing, and for statistical purposes. Read more about how we use and protect your personal data and cookies in our <a href="https://www.avarda.com/">Privacy Policy</a> and <a href="https://www.avarda.com/">Cookie Policy</a>. You can revoke your consent to the processing of personal data and cookies at any time by unsubscribing from the newsletter.</p>',
};
 
window.avardaCheckoutInit({
  //...additional checkout 3 configuration
  extras: extras,
});

Styling the extra terms and conditions

The provided markup is styled by default to match the styling of the Checkout 3 footer. Overriding of the default styling is possible by using inline styling inside the HTML markup.

Example of default styling

Example of custom terms and conditions passed into Checkout as Extra Flags

autoLoadShippingScript

The loading behaviour of the necessary shipping module bundle can be controlled using a boolean flag.

  • When this flag is set to true, the Checkout 3 application will make an attempt to autonomously load all the prerequisites and insert the required script tags. This is the default behaviour.

  • In scenarios where the website’s technology stack employs alternative methods for loading third-party scripts, we offer the option to deactivate automatic loading by setting the flag to false.

const extras = {
  autoLoadShippingScript: false,
};
 
window.avardaCheckoutInit({
  //...additional checkout 3 configuration
  extras: extras,
});

If the automatic loading of the shipping script is disabled, the responsibility for incorporating the script falls upon the developer. In such cases, the developer is required to ensure that the script is loaded prior to the Checkout3 bundle.

Details of how to include the required script can be found at Avarda NShift integration guide.