Add "I Agree to Terms" Checkbox

Add "I Agree to Terms" Checkbox

It's pretty clear that including a Privacy Policy or a Terms and Conditions section on your website is important.

In the case of a Privacy Policy, it's also required by law.

However, it’s just as important to be able to enforce these legal agreements, as they will do you no good if they're found to be unenforceable. The best way to do this is with an "I Agree" checkbox.

A Terms and Conditions agreement or a Privacy Policy are legally binding agreements between you (the company, mobile app developer, website owner, e-commerce store owner, etc.) and the people using your website, app, service, etc.

The best method to use to make these legal agreements enforceable is called the clickwrap method. This method uses a checkbox and/or clearly-labeled button that a user must "click" to show agreement. Here's an example of clickwrap being used to get agreement to a Software and Services Agreement:

Fabric - I Agree to Software and Services Agreement

When the GDPR privacy law from the EU became effective and increased consent requirements for businesses around the world, the use of these types of checkboxes went from "highly recommended" to "required" in some situations.

Even if you don't have any customers in the EU and aren't affected by the GDPR, modern privacy laws around the world are springing up that mirror the GDPR. This means you should add a checkbox to get agreement regardless of what privacy laws apply to you at the moment to stay one step ahead. These checkboxes also just hold up better in court if you ever need to prove that a customer actually did agree to your terms.

Some common phrasing you'll often see with these checkboxes include:

  • "I agree to the Terms and Conditions" or "I agree to the Privacy Policy"
  • "I have read and agree to the Terms" or "I have read and agree to the Privacy Policy"
  • "I accept the Terms of Service" or "I accept the Privacy Statement"
  • "Click here to indicate that you have read and agree to the terms presented in the Terms and Conditions agreement"

As long as the statement makes it very clear, with no doubt, what exactly the user is intending to agree with by clicking the checkbox field, you can use whatever wording you want.

Examples of "I Agree" Checkboxes

When you sign-up for an account with Engine Yard you're required to check the "I agree to the terms of service" checkbox before clicking on the "Sign Up" button:

EngineYard - I Agree To Terms of Service

The Terms of Service page is linked to the field.

This is highly recommended. You should always link to the legal agreement page right next to the checkbox to make it easier for users to read the agreement.

In contrast, Facebook uses a combination of browsewrap and clickwrap by placing a small text above the "Sign Up" button:

Facebook Example of Click-wrap

Amazon AWS implements the clickwrap method as well. When signing up for a new account with Amazon Web Services, you're required to read the AWS Customer Agreement:

Amazon AWS I Agree To Customer Agreement Checkbox

If you don't check the "Check here to indicate that you have read and agree to the terms of the AWS Customer Agreement" you can't click on the "Create Account and Continue" button to create an account:

Amazon AWS I Agree To Customer Agreement Checkbox Unchecked

The AWS Customer Agreement is the legally binding agreement that Amazon wants you to read and agree to in order to set up an account.

In your case, this can be a Terms and Conditions, a Terms of Service, a Terms of Use, a Privacy Policy or a Website Disclaimer that users must read and agree to in order to create an account on your website or mobile app.

The same checkbox method should apply to already registered users of your website, mobile app, SaaS app, Facebook app etc.

If you already have registered users and you're planning an update to the legal agreements, you should provide a notice to users of the changes before the effective date of the agreement.

You can implement the clickwrap method with an "I Agree" checkbox in cases where you are updating your Terms or Privacy Policy agreement and you want to notify users about these updates so they can read and accept the new terms.

This is an example of how to do this:

Elance Terms of Service Updated Notification To Users

Microsoft does something similar by notifying users of a Terms of Service update affecting their accounts. However, users are not required to click a "I Agree" or "I Accept" checkbox, but rather to click the "Continue" button to acknowledge that they have read the presented notification:

Microsoft Updates Terms Continue Notification

Where to Add "I Agree" Checkboxes

You should add these agreement checkboxes whenever you need users to agree to your terms and give consent for your practices.

Some common places include the following:

  • Account sign-up/registration forms
  • In Cookie Consent notices
  • In a website footer
  • In a mobile app menu
  • On a checkout form
  • On an email newsletter sign-up form
  • On a contact form
  • On an installation page

The earlier on in the relationship between your website/app and your users that you present an "I Agree" checkbox, the better. This ensures that from the very beginning, you'll have the agreement and the consent that you need in order to comply with laws and uphold your terms in court if needed.

Add "I Agree" Checkbox in HTML/JavaScript

The easiest way to implement the "I Agree" or "I Accept" checkbox is through JavaScript which you can use in your HTML pages.

If the "I Agree" checkbox isn't checked, a pop-up will inform the user that the checkbox must be clicked before continuing with the form:

<form action="#" onsubmit="if(document.getElementById('agree').checked) { return true; } else { alert('Please indicate that you have read and agree to the Terms and Conditions and Privacy Policy'); return false; }">

<input type="checkbox" name="checkbox" value="check" id="agree" /> I have read and agree to the Terms and Conditions and Privacy Policy
<input type="submit" name="submit" value="submit" />

</form>

If the user doesn't check the checkbox, the form will not be submitted and the user can't continue.

The pop-up notification would look like this:

Dialog to indicate to have read and agree to terms

Add "I Agree" Checkbox in PHP

The JavaScript method of making sure that a user agrees to a presented Terms agreement isn't the most secure as some users can bypass JavaScript and still continue with the form on your website without checking the checkbox.

In this case, use PHP or the language your website is programmed in - Ruby, Phyton - to add a second layer of checking.

A sample code to make sure your "I Agree" checkbox is checked by users in PHP is this:

if(empty($_POST['agree']) || $_POST['agree'] != 'agree') {
    echo 'Please indicate that you have read and agree to the Terms and Conditions and Privacy Policy';
}

In your HTML/PHP pages also use the JavaScript method and use the PHP method to make sure the checkbox is checked:

<form action="#" onsubmit="if(document.getElementById('agree').checked) { return true; } else { alert('Please indicate that you have read and agree to the Terms and Conditions and Privacy Policy'); return false; }">

<input type="checkbox" name="checkbox" value="check" id="agree" /> I have read and agree to the Terms and Conditions and Privacy Policy
<input type="submit" name="submit" value="submit" />

</form>

This would create a double layer of checking if the checkbox is checked by a user or not.

This article is not a substitute for professional legal advice. This article does not create an attorney-client relationship, nor is it a solicitation to offer legal advice.