Saturday, 3 September 2016

Change Add To Cart Button Colour.

This tutorial I will be showing you how to change the colour of the add to cart button that is found on product pages. For this I will be using cPanel.

The button I want to change.

To do this you need to access your stylesheet.css (public_html/catalog/view/theme/default/stylesheet). Now you need to find .btn-primary { (located on line 419).
To change the background colour of the add to cart box you need to change background-color and background-image. For the border of the button you will need to change border-color. Now to change the text, to change the text colour change the color option and set the text shadow to 0. This section should now look like this:

.btn-primary {
color: #696969;
text-shadow: 0 -0px 0 rgba(0, 0, 0, 0.0);
background-color: #F2F2F2;
background-image: linear-gradient(to bottom, #F2F2F2, #F2F2F2);
background-repeat: repeat-x;

border-color: #d9d9d9 #d9d9d9 #d9d9d9;

This will change the colour of the add to cart button.
Final Result.
Sam

0 comments:

Post a Comment