Checkout & consent

How to Add a Terms and Conditions Checkbox to Shopify

Use this Shopify terms-checkbox checklist to choose the right cart, drawer, product-button, or Plus checkout placement, then configure and test it.

Illustration of an ecommerce cart, required checkbox, policy document, and protective shield

To add a terms and conditions checkbox to Shopify, first map every way a shopper can reach checkout. Then place the required agreement beside the relevant cart or product-page control, link the policy, block the intended action while the checkbox is unchecked, and test every live purchase path.

A checkbox on the full cart does not automatically cover a cart drawer, a Buy It Now button, or a custom flow that goes directly to checkout.

A checkbox records an interaction; it does not decide whether a policy or consent process is legally sufficient. Use wording appropriate to your business and seek professional advice when needed.

The quick implementation checklist

  • Publish the policy the shopper needs to read.
  • List every full-cart, drawer, product-button, and direct-checkout path.
  • Choose theme code, an app, or Shopify Plus Checkout Blocks.
  • Use a clear label with a working policy link or readable popup.
  • Stop the intended checkout action while the agreement is unchecked.
  • Test desktop, mobile, accelerated buttons, and cart-changing apps.
  • Complete a test order and verify the stored acknowledgement if you need an order record.

The goal is one clear action before checkout. Shopify storefronts sometimes take the scenic route to get there.

1. Decide what the customer is acknowledging

Start with a real, current policy—not the checkbox styling.

Shopify lets merchants add refund, privacy, terms of service, shipping, subscription, and other policies from Settings → Policies. Review Shopify’s store-policy instructions and make the relevant pages easy to open.

A terms checkbox can point shoppers to information such as:

  • a refund or return condition;
  • a realistic delivery or made-to-order timeline;
  • a final-sale or non-returnable item policy;
  • customisation or handling instructions; or
  • subscription and cancellation terms.

Keep the label specific. “I agree to the terms of service and return policy” tells the shopper more than “I agree.” Link each policy named in the label or make the relevant text readable in a popup.

Do not ask customers to accept a document they cannot open.

2. Choose the correct placement

Use the store’s real purchase paths to choose where the Shopify agree-to-terms checkbox belongs.

Full cart page

Use the full cart when shoppers reliably visit /cart and its checkout button is the only route onward. Place the checkbox beside that actual checkout control and confirm the unchecked state blocks it.

This method does not cover a cart drawer or a product-page button that skips the cart.

Cart drawer or mini-cart

If the theme uses a slide-out cart, put the agreement beside the drawer’s checkout control as well. Some themes, bundle tools, upsell apps, and cart apps redraw the drawer after the page loads, so a checkbox can disappear or become detached from the replacement button.

Test the published storefront again after a meaningful theme or cart-app change. A beautifully styled checkbox on an unused cart page is mostly decorative.

Buy It Now and accelerated checkout buttons

Shopify describes accelerated checkout buttons as an alternative to Add to cart. An unbranded Buy It Now button can skip the cart and go directly to checkout.

If the agreement must apply to that path, either:

  • use an implementation that places and enforces the agreement before the supported product-page button; or
  • hide accelerated buttons so shoppers follow the cart path, after considering the storefront trade-off.

Do not assume a cart-only checkbox protects a purchase button that never opens the cart.

Checkout on Shopify Plus

If the agreement must appear inside checkout, Shopify Plus merchants can evaluate a required Checkout Blocks custom field. Shopify’s current custom-field documentation includes an Agree to terms template and storage options such as an order metafield, attribute, or note.

This is different from adding a storefront checkbox before checkout. Check Shopify’s current plan and placement requirements before choosing it.

3. Choose theme code, an app, or Checkout Blocks

There is no single best implementation for every store.

Theme code

Theme code can fit when the store has one predictable cart, someone can maintain the implementation, and the team will retest it after theme updates.

The code must match the published theme’s current markup and JavaScript. It should remain keyboard accessible, block the intended action while unchecked, and store the response if an order record is required.

Avoid treating an old universal snippet as permanent Shopify code. Theme file names, drawers, and checkout controls differ, and a visible checkbox is incomplete if another button can still continue.

A Shopify app

An app is useful when the merchant needs configurable wording, a popup or linked policy, a custom unchecked message, cart-drawer behavior, an order record, product-button protection, or support with a theme-specific cart.

An app still needs testing on the published storefront. Custom carts and purchase flows can behave differently.

Shopify Plus Checkout Blocks

Use Checkout Blocks when the required action belongs inside an eligible Shopify Plus checkout. Configure the placement, required state, and storage option, then test the active checkout configuration.

4. Add the checkbox with I Agree

I Agree — Terms & Conditions Checkbox is designed for a store-wide agreement before supported storefront checkout paths.

Setup checklist

  1. Write the label. Name the policy or acknowledgement the shopper is accepting.
  2. Choose the policy view. Show formatted content in a popup or open an existing policy page in a new tab.
  3. Set the unchecked response. Show a custom message or open the terms popup when the shopper tries to continue without accepting.
  4. Match the theme. Adjust the link color and spacing; use custom CSS only when the storefront needs it.
  5. Review product-button protection. Keep Dynamic Checkout protection enabled when supported Buy It Now or accelerated buttons are part of the purchase path.
  6. Activate the app. Enable the I Agree app embed in the published theme and save.

The I Agree quick-start documentation covers the maintained setup and troubleshooting steps.

5. Test the situations that cause real confusion

Use these scenarios as a practical review—not as a promise that a checkbox will prevent every return, support request, or payment dispute.

“I didn’t see the return condition.”

Check whether the label named the policy, the link or popup worked, the wording was readable on mobile, and the acknowledgement was stored where staff expect it.

“I didn’t know delivery would take this long.”

Make the delivery or processing timeline accurate on the product page and in the relevant policy. The checkbox can surface that policy; it cannot repair a vague or unrealistic promise.

“Buy It Now let me continue without agreeing.”

The product button probably bypassed the cart. Enable and test the supported product-button protection, or route the purchase through the protected cart.

“The checkbox vanished from the cart drawer.”

The theme or another app may be replacing the drawer markup. Retest without the cart-changing app where practical, confirm the full cart behavior, and use the support path for a theme-specific inspection.

6. Verify every purchase route

Test each route once while unchecked and again after accepting:

  • Full cart on desktop
  • Full cart on mobile
  • Cart drawer or mini-cart on desktop
  • Cart drawer or mini-cart on mobile
  • Product-page Buy It Now
  • Accelerated payment buttons that actually appear for the store and test device
  • Featured-product sections with their own buttons
  • Bundle, upsell, subscription, or cart apps that replace checkout controls
  • A completed test order when the acknowledgement must be available to staff

The unchecked attempt should stop at the intended point and explain what the shopper needs to do. The accepted attempt should continue normally.

Invoice links and custom flows that go directly to checkout can bypass a storefront cart. Test them separately instead of assuming the checkbox applies.

7. Understand what the order record proves

A visible checkbox, a stored acknowledgement, and a legally sufficient consent process are three different questions.

I Agree carries the configured storefront acknowledgement and time into Shopify order details for staff review. A Checkout Blocks field can store its response using the option selected in Shopify.

That record shows what the configured interaction captured. It does not:

  • write or validate the store’s policy;
  • prove who used a payment method;
  • guarantee legal compliance;
  • guarantee the result of a return or chargeback; or
  • cover a purchase path that skipped the interaction.

Before you publish

  • The linked policy is current and readable.
  • The label explains what the shopper is accepting.
  • Every checkout control in use has been tested.
  • Keyboard and mobile interaction works.
  • The unchecked message is useful.
  • A test order contains the expected record, if required.
  • The standard store-wide setup fits; separate product-specific agreements are not assumed.
  • The team knows to retest after theme, cart, or checkout changes.

If a configurable storefront agreement fits the workflow, review I Agree’s features and limitations, follow the setup documentation, or view I Agree on the Shopify App Store for current listing details.