Jump to content

Recommended Posts

Hi everyone,

i have a problem with A/B test. I want to change color of "add to cart" button.

I created a javascript code (document.getElementsByClassName("add-to-cart")[0].style.background = "#5CB85C";), if i launch the code in the console the color of the button change, but when i put this code in google tag manager (or google optimize) and i set the tag for A/B test, the color of the button at the beginning of the page load it works, but when the page is fully loaded the button returns to the original color, as if other javascrit codece was loaded afterwards.


Do you know why this happens and how to fix it?


Share this post

Link to post
Share on other sites

Thanks for the answers, I did as you told me, but it still doesn't work.

At this link you can see the problem:



EDIT: You have to set oxy-cookie to 1.1 to see the change

Edited by gabbodrummer18
I forgot something (see edit history)

Share this post

Link to post
Share on other sites


you should add the class to the parent div, or let's say for the product-actions class div, just in case that on pageload the add to cart is being re-loaded or replaced by some theme JS, and add the css :


.ab-test .btn.add-to-cart{

background: rgb(92, 184, 92);

border-color: rgb(92, 184, 92);


Or you can fire your trigger which is adding the class to the dom loaded event inside Tagmanager.

Kind regards, Leo

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More