Add Required Check Box to Broadcast Theme Above "Add to Cart" Button

[Jsteves]

Hello,

I've been trying to add a required check box above the "Add to Cart" button on specific product pages, but have been unsuccessful.

I've attached the code I made for the checkbox, but I can't find the right place to put it in. Also, I am unable to make it for a customer to be required to check the box before adding the product to cart. I have currently added it in a "Custom HTML" section for my product pages to test it but I've shown where I'd like it to be positioned in the image below.

<p style="float: none; text-align: right; clear: both; margin: -30px 3;">
  <input style="float:none; vertical-align: middle;" type="checkbox" id="agree" required="required">
  <label style="display:inline; float:none" for="agree">
    <small>I agree that I am 21 years or older. I agree with the <a href="https://theboomastore.com/policies/terms-of-service">terms and conditions.</a></small>
  </label>
</p>

Theme: Broadcast

Store URL: https://theboomastore.com/

Thanks in advance for any suggestions

[Developer-G]

Hello @Jsteves ,

You have to add this html in product.liquid before 'add to cart' button and with in condition if product is available which is easy part.

But the main logic you have to apply is on click of 'add to cart' I see you are using ajax cart means before performing the ajax function you have to read the checkbox value and if it's true then allow ajax to perform it's action else stop it and show a alert to customer so he can check the checkbox before 'add to cart'.

If you know liquid and JS then you can follow the idea easily but if you can't then you have to go with developer.

Thanks