Skip to content

Search is only available in production builds. Try building and previewing the site to test it out locally.

Multi-store

Terms & Conditions setup

The Terms & Conditions feature must be enabled and configured to be available during the guest checkout process before placing an order. The configured terms and conditions will appear in the Checkout component within the TermsAndConditions container as specific checkboxes. Each checkbox will display a label with text and links, directing users to the corresponding agreement pages configured at store-view level.

How to enable and configure the Terms and Conditions

This checkout component is configurable on a per store-view basis on EDS, but a merchant can also rely on the Admin Panel’s configuration.

Follow the next step-by-step guide to enable and configure the Terms and Conditions:

Enable the component

The merchant has to enable the component in the Admin Panel as following:

  1. Log in to the Admin Panel.

  2. On the Admin sidebar, go to Stores > Settings > Configuration.

  3. In the left panel, expand Sales and choose Checkout.

  4. Expand the Checkout Options section.

  5. Set Enable Terms and Conditions to “Yes”.

  6. Click Save Config.

See Terms and conditions for checkout documentation for more information on how to enable the terms and conditions using the Admin Panel.

Create the agreement document

The agreements pages will be created ONLY using document-based authoring (DBA) within EDS instead of using the Admin Panel, allowing the merchant to create and manage as many agreements pages and content as required for each store-view and language.

Configure the agreement checkbox label

Since the agreements pages will be created using DBA within EDS, the agreements checkbox label should support different links for each store-view, directing them to the appropriate agreements pages.

The merchant has two options in order to configure the label to display next to the checkbox:

  1. Using EDS

    For each agreement, the merchant has to configure into the placeholders.xlsx EDS file the following information:

    • An identifier: It’s the reference that identifies the label translated
    • A label: It’s the text to display next to the checkbox, and will be directly retrieved from the Boilerplate translations for a specific store-view and language. This data accepts HTML with links to a specific page in EDS

    Similarly, the merchant can configure the translation for the validation error that appears when the user clicks the Place Order button and an agreement is not checked, using the “Checkout.TermsAndConditions.error” identifier.

    Sample of placeholders.xlsx file:

    "Checkout.TermsAndConditions.label", "I have read, understand, and accept the <a href='/en/privacy-policy' target='_blank'>Terms of Use, Terms of Sales, Privacy Policy, and Return Policy</a>."
    "Checkout.TermsAndConditions.terms_label", "By placing an order, you are agreeing to be bound by our <a href="/en/terms-and-conditions" target="_blank">Terms And Conditions</a>."
    "Checkout.TermsAndConditions.privacy_label", "By placing an order, you acknowledge our <a href="/en/privacy-policy" target="_blank">Privacy Policy</a>."
    "Checkout.TermsAndConditions.error", "Please accept the Terms and Conditions to continue."

    These labels will be used in order to render the TermsAndConditions container inside of the commerce-checkout.js block file.

    Visit the TermsAndConditions container documentation to see examples on how to use these labels.

  1. Using Admin Panel

    The merchant has to configure the checkbox label for each agreement using the Admin Panel. As mentioned before, the Admin Panel allows to create configurations per store-view level as following:

  1. Log in to the Admin Panel.

  2. On the Admin sidebar, go to Stores > Settings > Terms and Conditions.

  3. In the upper-right corner, click Add New Condition button.

  4. Enter the next Terms and Conditions information:

    • Condition Name The agreement identifier
    • Status Attribute to indicate if it’s available or not:
      • ‘Enabled’; the agreement will be retrieved by the GraphQL API query
      • ‘Disabled’; the agreement won’t be retrieved by the GraphQL API query
    • Applied Specifies the mode how the checkbox should appear:
      • ‘Manually’: the user is required to manually check and accept the conditions to place an order
      • ‘Automatically’: the checkbox will appear checked by default, conditions are automatically accepted upon checkout
    • Store View Defines the scope at store view level for this agreement where you want these Terms and Conditions to be used
    • Checkbox Text It contains directly the text to show; it accepts HTML with links to a specific page in EDS
  5. Click Save Condition.

    These entries will be used in order to render the TermsAndConditions container inside of the commerce-checkout.js block file.

    Visit the TermsAndConditions container documentation to see examples of this feature.

See the Terms and conditions for checkout documentation to learn how to configure the terms and conditions using the Admin Panel.