Cart - Add an 'Agree to terms and conditions' checkbox

Store Design
73

Ok so people are not very good at explaining on how to do this for people who are not familiar with programming. I struggled and finally completed this, although half-way.

Did this on Debut theme, the “Accept to terms and conditions” warning shows up only after “Add to cart” is selected. If i select “Buy now” nothing happens as it bypasses the Cart directly to the Checkout so i had to disable Buy now button. Would appreciate if anyone could offer a solution so that the Terms and conditions checkbox appears in the window where customer must enter billing and shipping information (After clicking “Add to cart” or “Buy now”). I suppose it’s called Contact_information / page.contact.liquid.

  1. Go to “Online store”-> Select your live theme → Actions → Edit code

  2. Select Assets folder, find theme.js

  3. Go to the very end and paste the code:

$(document).ready(function() {
$(‘body’).on(‘click’, ‘[name=“checkout”], [name=“goto_pp”], [name=“goto_gc”]’, function() {
if ($(‘#agree’).is(‘:checked’)) { $(this).submit(); }
else {
alert(“You must agree with the terms and conditions of sales to check out.”); return false;
}
});
});

You can translate text “You must agree with the terms and conditions of sales to check out.” to whatever language your shop is directly in the code.

  1. Click Save, then go Sections->find Cart-template.liquid

  2. Look for this code using Ctrl+F and search for cart.general.checkout

{{ taxes_shipping_checkout }}
{%- unless section.settings.cart_ajax_enable -%} {%- endunless -%}
  1. Directly before the line <input type=“submit” name=“checkout” paste this code:

I agree with the terms and conditions.

So your final code looks like this:

{{ taxes_shipping_checkout }}
{%- unless section.settings.cart_ajax_enable -%} {%- endunless -%} **

** **** **** **I agree with the terms and conditions.** **** **

**

  1. Click Save, go check your shop if it works.

  2. To disable “Buy now” button go to Online store → Customize

  3. At the top left of the website preview (where Home Page is written by default) select “Product pages”

  4. In the Sections click Product Pages and disable “Show dynamic checkout button”