Thank you for the great tutorials but the required is not working for me. Also, I don’t have that JS line in my theme, should I add that manually?
Topic summary
A tutorial explains how to add a mandatory ‘Agree to terms and conditions’ checkbox to Shopify cart pages using custom code. The implementation differs between sectioned themes (post-2016) and non-sectioned themes, requiring edits to theme.js/theme.liquid and cart template files with jQuery code.
Key Implementation Issues:
- The checkbox can only be added to the cart page, not the actual checkout page (unless using Shopify Plus at $2,000+/month)
- Many users report the checkbox appears but isn’t actually required—customers can bypass it
- Solutions include adding
required="required"attribute or creating a separate custom.js file - Additional checkout buttons (Apple Pay, Google Pay) bypass the validation entirely
Theme-Specific Challenges:
- Dawn, Debut, Narrative, Prestige, and Brooklyn themes require different approaches
- Some themes need code in custom.js instead of theme.js due to load order issues
- jQuery version must be 1.7 or higher for the code to function
Legal Compliance Concerns:
- Multiple users note this workaround is insufficient for EU/German regulations requiring checkboxes at final checkout
- The limitation frustrates merchants needing proper consent collection for legal compliance
Current Solutions:
- A free app (RA Terms and Conditions Checkbox) now exists as an alternative to manual coding
- Various code modifications shared for handling cart drawers, multiple checkboxes, and styling adjustments
Hi dclopez, I am using Blockshop as well did this work for you end the end?
Hi Dclopez, I tried this but it still let’s me checkout with having to click the button, is yours still allowing you to have to click the checkbox?
This didnt work for me
Hello! This worked for me, but how do I add a pop-up to remind the customers to tick the checkbox before clicking checkout? When they don’t click the checkbox, the page just loads and does not proceed to checkout.
Hi I am using Modular theme and in second step:
- In the Templates directory, click cart.liquid.
- Find the HTML code for your checkout button. Look for a or an element with the name attribute set to checkout. The code might look something like this:
I dot have in this section or an I have just this codes:
{% include 'site-cart' %}
{% include ‘ajax-cart’ %}
Can someone help with this what to do?
thank you so much 
Debe ser porque estas utilizando theme.liquid en ves de theme.js
Yo tuve el mismo problema pero si copias el código html correctamente todo funciona bien, revisa lo que te digo, no utilices la sección theme.liquid
Hi - I’m using Debut and this worked great, just one thing I can’t work out - the ‘font’ of ‘terms & conditions’ is not adopting my theme font. How can I do this? Here is how it looks:
Here is the code:
Is it also possible that when the read the terms it can open in a new window rather than take them away from the checkout?
Thank you so much! It would be awesome to sort this final fixes.
1 Like
Hi,
thank you for your answer regarding o checkbox. First step in section
Layout - Theme.js I did changes but second step in section action
Template- cart. liquid. I don’t have required codesand I dont know where to
put coes for checkout button I have just codes in attachment.
Can you help me how to manage it please?
thanks
Dagmar
Sorry - i was asking a question of the community, not providing an answer!
Which format/coding section did you use for your debut theme? I also have debut and am not sure which one to use.
Hi,
I use Modular not Debut theme. Thats why it is different.
thank you
Dagmar
Nice tutorial, pretty easy to implement BUT… Is there a way to translate the text shown on the page and the popup that appears if the box is not checked ?
Thanks, I got this working fine on Debut theme. However it’s not immediately obvious that you have to click the text to proceed, see screenshot.
Debut theme does not allow a different colour for links only. Anyway to underline the text to make it more obvious to at least have the hover colour different?
Thanks
Hi, this works great for me with only one issue. The text and checkbox appear next to the “checkout” button instead of right above. Is there a way to do it as it’s pictured in the screenshot? Thank you!
I had the same question as you. Have you been able to figure it out? Any help is appreciated!
[quote=“LadyKM”]
wrote:> > Hi - I’m using Debut and this worked great, just one thing I can’t work out - the ‘font’ of ‘terms & conditions’ is not adopting my theme font. How can I do this? Here is how it looks:> >
> > Here is the code:> > > > Is it also possible that when the read the terms it can open in a new window rather than take them away from the checkout?> > Thank you so much! It would be awesome to sort this final fixes.
[/quote]>
Thank you!
I’m on theme Venture, it works but the text appears in uppercase…
How can I have it in a normal font, with a capital letter only when I put a capital letter?
Hello!
I am completly new in shopify. I have the same problem as all - NO confirmation for terms and Policy on the checkout.
I have read all the blog. and I saw , you have figure out , and it is working good for you. I have DEBUT theme as you. Could you plase tell me step by step, what to do, to get - I agree with Therm and Conditions on my shop?
I am not advance person with computers would be great to follow your steps!!!
Thank you so much!
Loooking forward to your answer!
Joanna
Hello! I have follow the instruction and its working for me good. Thank you for this advice. Just it is not working for ExpressPay Pal button. any sygestion?
Not working on Narrative theme. As others mentioned the js inserted into theme.js is simply ignored. Not sure why. Inserting the js into the file custom.js works though.
2 Likes