Hi,
How could I add a checkbox confirming the terms and conditions in the cart in the Symmetry store as in the screenshot below?
My store: https://www.drollsport.com/
Password: Wixa
Hi @elotomo .
This is the way how it should be done:
Currently checkout button is just a link, not form button. so first you need change html code and disable link with ‘disabled’ parameter. Then you need to create html input checkbox field with text you need (add text as translatable string). Then you need to create custom js code which will listen for this checkbox to be checked and remove ‘disabled’ parameter from link. also you can set a click listener on checkout button with disabled state to highlight checkbox area so user will see he needs to check it first to make an order (but this method will need more complex approach with aria-disabled parameter).
From your Shopify admin, go to Online Store > Themes Find the theme you want to edit and click Actions > Edit code.
locate the cart template ‘cart.liquid’
and add this code
then add this javascript in theme.liquid file to make it required
document.addEventListener('DOMContentLoaded', function() {
const checkoutButton = document.querySelector('button[name="checkout"]');
const termsCheckbox = document.getElementById('terms-conditions-checkbox');
checkoutButton.addEventListener('click', function(event) {
if (!termsCheckbox.checked) {
event.preventDefault();
alert('Please agree to the Terms and Conditions before proceeding to checkout.');
}
});
});