Until recently, adding a terms and conditions checkbox in your WooCommerce checkout page was very easy, but changing its text was not because you needed to add some custom coding.
Now, thanks (at least for this) to the GDPR law, WooCommerce has made it easier to edit the terms and conditions checkbox text. You don’t need to add coding anymore!
Let’s see how it’s done.
Edit WooCommerce’s terms and conditions checkbox text
All you have to do is to:
1. Log into your WordPress Dashboard;
2. Go to Appearance -> Customize.
Yes, WooCommerce added some features there.
3. Select WooCommerce -> Checkout.
4. Edit the Terms and conditions text, which is found at the very bottom.
Make sure the proper terms and conditions page is selected as well!
5. Click the Publish button!
That’s it!
Now go to your checkout page and see if the terms and conditions text has changed.
If not, try clearing your browser and/or website cache, even though the cart and checkout pages should usually be excluded from any caching plugins by default.
How to add a custom link to the terms and conditions text
Since several people have asked for this, here’s an update.
If you don’t want to link to the standard terms and conditions page, then you can swap the [terms] shortcode with an HTML link. For example:
I have read and agree to the website's <a href="https://example.com/refund-terms-url">Refund Terms</a>.
That’s a wrap
Hope the post was comprehensive enough and helped you to edit the terms and conditions checkbox text in your WooCommerce checkout page.
If you have any questions or thoughts, drop a comment, contact us or message us on Facebook.
You can also follow us on Twitter and subscribe to our YouTube channel.
If you want to start your own WordPress blog, or need a website for your business, our WordPress website services are at your disposal! We also provide WordPress support and maintenance!
You can also purchase a ready-made WordPress website with hosting and support included!
Thanks fro sharing, helpful for beginner.
I might be late with this question but I will give it a try?
How can I edit the “Privacy policy” and “Terms and Conditions” text to make the links which appear as [privacy_policy] & [term] in the text box white in color and are invisible for the buyer? The rest of the text stays black/dark grey….
This CSS code should work:
.woocommerce-terms-and-conditions-wrapper a{color: #000000;}The quickest way to add it is via Appearance -> Customize -> Additional CSS. Change
#000000to whatever hex color code you want. You should check your theme’s settings and see what color is used for your links or as the main color of the site. Then use that color code.A big THANK YOU for your quick and easy to follow tip. It saved me loads of time. Congratz on the excellent and free content you provide here plus the insights you add in the answers!
The code you provided worked as described in the Theme customizer and now “terms and conditions” phrase is in red and visible for buyers. I tried to follow the same example for another line (“Click here to enter your code”) in the checkout page invisible for buyers (since is typed in white over a white-grayish background of a WooCommerce box/container) but it did not work.
Here is what i added in Appearance -> Customize -> Additional CSS:
.woocommerce-Click-here-to-enter-your-code-wrapper a{color: #ff0000;}
Any idea how to proceed?
Unfortunately my theme`s customiser does not have a setting for link colors but only for color of site title and site tagline.
How your answers will reach more readers (especially beginners) since although small they can prevent buyers from buying and Google Shooping ads unavailable and Merchant Center Account suspended.
The text color i am trying to change on the checkout for of WooCommerce above is part of the Coupon section where the full text says “Have a coupon? Click here to enter your code”
You’re welcome and thanks for your kind words!
You need to see the correct CSS class in the page’s source code in order to make changes to it.
That part you mentioned is different on my theme, so most likely the CSS class will differ. Therefore, I’ll need your product’s page in order to check things out and provide the right code.
Hi, how can I disable the default behovior for the Terms link ? It appears as
<a href rel="nofollow">with correct link, but clicking on the link causes some js to kick in and only reveal a hidden taxt above the checkbox. I would like the link behave like a link, without javascript attached. Hod can I achieve this ?Hello!
This is not a default behavior, and I think it’s caused by your theme or a plugin feature that you might be using. I recommend checking your theme and plugins settings.
THANK YOU
Happy to help! :D
I would like to insert in the checkbox text a link to my cancellation terms. How is that possible?
Add an HTML link:
<a href="https://example.com/your-page-url" target="_blank" rel="noopener">Add your link text here</a>.Think that should work.
target="_blank"is optional. It opens the link in a new tab. If you don’t want that and you’ll removetarget="_blank", then also removerel="noopener"since that’s just for links that open in a new tab.Let me know if it didn’t work.
Love the post. Have a problem. For some reason the checkbox is overlapping the “I agree to the website “terms and conditions* text. Checkbox appears right over the “I a”
I’m glad you love the post! Thanks! :D
That’s caused by a CSS issue. I checked your checkout page, and here’s the fix:
.woocommerce form .form-row .input-checkbox {margin: 2px 8px 0 -20px;}If that somehow doesn’t take effect, add
!important:.woocommerce form .form-row .input-checkbox {margin: 2px 8px 0 -20px !important;}Here’s how to add CSS in WordPress.
Excellent post
I’m searching for a way to change terms and conditions to Refund Policy in the shortcode [terms]
I would like it to read like this
I have read and agree to the website Refund Policy [refundpoiicy]
Where [refundpoiicy] brings up the page Refund Policy.
Opps Spelling error [refundpoiicy] should read [refundpolicy]
Thanks!
You can add a link using HTML. So, in your case, just add:
I have read and agree to the website <a href="https://example.com/your-refund-policy-page-url">Refund Policy</a>.Hello
Do you know how I can change the terms and conditions link language?
At this moment the message of the link is “terms and conditions”
but I want it to say “Terminos y condiciones”, but without modifying the functionality
Hi! The simplest way to do that is not to use the shortcode
[terms]. Instead, add a custom link like the one I’ve shown at the end of the post, add write it in any language that you need.Hello, thanks for the answer
I did a test and it works, but it sends the user to the link in another window, I do not want to send the client to another link or another window, I want the client to click and show the information as it is by default, without showing another place, so that the client does not lose the interest to buy, and that does not leave the shopping cart
I apologize for the translation, I speak Spanish and use google translate
No worries. Google Translate does a very good job. :D
1. If you mean that the link opens in a new browser tab, then it might be a theme feature, because I didn’t add
target="_blank"to the link. So, the link I added is not meant to open new tabs or windows.2. If by “another window”, you mean that the link loads over your checkout page, replacing it, basically, instead of opening the Terms in a scrollable frame inside the checkout page, as the
[terms]shortcode does, then you’re right. That’s the disadvantage of using a custom link instead of the[terms]shortcode.Anyway, that link should be translated by default if you’ve set the proper language in WordPress. But since it’s not, do the following:
1. Use a translation plugin and see if it works. Loco Translate is usually recommended.
2. If you have a theme that has WooCommerce support, it might have files that override some of the WooCommerce files, so I suggest asking the theme developers for help with some specific custom code to translate the terms link.
3. You could ask for help on the WooCommerce forum.
You’ll need a code to add in your child theme’s
functions.phpfile, otherwise, the change you make will disappear after each update.Hello thank you very much
option number 2 is what I speak
I tried loco translate and found untranslated words and changed them
but unfortunately I can not make it translate “term and conditions”
“term and conditions” is in woocommerce and my electro theme
I made the changes but there are no changes
I’m using a localhost for the tests
how difficult it is to find what disables that translation
I’m still looking for a solution, if you have another idea welcome
thank you very very much
Hello
I have already managed to translate
with the help of Loco Translate I found the PHP file that contains the phrase “terms and conditions”
it is located in the wc-template-functions.php file on line 849
I made the changes and it worked
Thank you very much for your help
Awesome! You’re welcome!
Hi,
I have problem with checkbox on my checkout page. I can’t see the checkbox.
Please help!
Hello! The checkbox doesn’t appear at all? Does the checkbox’s text appear? It might be some sort of conflict going on, either with another plugin or the theme.
I AM unable to change terms and service text on checkout page in Appearances tab also plz guide me
That shouldn’t happen. Do you change the text in Customize, but it doesn’t change on your checkout page? If so, clear your website and browser cache.
i have cleared all the cache and add it through Appearances
i have tried many methods to change terms and condition text but not able to do it plz help in this regard,,
Then there must be some sort of conflict going on that prevents the changes to take place. Disable your plugins one by one (except WooCommerce) and check again. Clear the caches after each plugin disabled.
If a plugin doesn’t cause this, keep them disabled and switch to a default WordPress theme (e.g. Twenty Seventeen).
Create a backup before doing all of this.
Oh my God, you just saved me from installing some unnecessary plugin because I had no idea how to do this simply. ;D Thank you, thank you!!!
You’re welcome! I’m happy that my post helped you out! :D
Thank you very much for the great post. I was looking for a long time to get it changed.Now I can thanks to you! However, a peculiar thing happened: When I translated the text in the Woocommerce/Checkbox into German, at the frontend all words started with a capital letter, which is not what I wrote into the checkbox text field. Two questions:
1) how can I change this peculiar behavior back to what I wrote?
2) how can I change the style of the linked words into bold letters?
Would love to get your guidance.
I’m glad the post helped you out!
That’s a strange issue indeed, but there’s a fix.
1. In order for the text to appear exactly how you write it, add this CSS code in WordPress:
.woocommerce-terms-and-conditions-checkbox-text {text-transform:none;}2. To make the words from the link bold, add this code:
.woocommerce-terms-and-conditions-checkbox-text a {font-weight:bold;}Here’s how to add CSS in WordPress.
If the code doesn’t work
1. Clear your site and browser cache (or check with an Incognito/Private browser window);
2. You might have a different CSS class or id. To find it out, right-click somewhere on the on the checkbox text (in the checkout page), but exactly on it, and select Inspect or Inspect Element (depends on the browser). The class or id should be highlighted there (e.g.
class="example"orid="example").Change the one from my CSS code with the one you found. Don’t forget to add a dot if it’s a class or a # sign if it’s an id (e.g.
#woocommerce-class{code goes here;}).3. If you cleared the cache and have the correct class or id, but it’s still not working, add
!importantin the CSS code, like this:.woocommerce-terms-and-conditions-checkbox-text a {font-weight:bold !important;}I hope this will help you out!
Hello,
Is there a way to have any kind of proof the someone really has checked the option to agree with these terms and conditions? I know that It’s impossible to finalize a purchase without accepting them, but I would like to know (in case of problems with a customer) if I can proof that. There is no reference in the WooCommerce/Orders view. Maybe an option to add it in the email that the customer gets after his purchase ?
Hello!
There is no part to change the text of the Terms & Conditions checkbox text :(
Thank you!
Please anybody help.. The checkout box editor does not appear for me, I can only choose which page is terms, and which page is privacy policy
Hello, I am having a problem with mny Terms and conditions. I would like them appear automaticly without pressing on them to be displayed. I have used a PopUp, but it seems antique using it,
I am trying to change through the PHP acchive named terms.php. But i dont know the code to make it display without pressing on its link.
This helped – easy and understandable! Thank you so much :)