Change color of buttons and prices

Solved
mela2019
Tourist
8 0 1

Hi,

 

I recently signed up on Shopify and I'm trying to learn how it works. I've already set up several things in the store, but I have some problems that I think depend on the theme's source code.

 

My problems:
1) How do I change the colors of the buttons (all) when I'm in mouseover?

2) How do I change the color of "Add to cart" button (normal and mouseover)?
Immagine.jpg

 

 

 

3) How can I change the color of products prices (all except where are barred)?
Cattura.PNG

 

The color I would like to use for prices is: #5fbf00 (green).

 

I use the Venture theme and I know very little about programming language, but I think I can make changes to the source code, otherwise I always have a backup.

 

Thank you.

0 Likes
Jasoliya
Shopify Expert
4365 574 1100

HI @mela2019 

Send me your store url 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

button#AddToCart-product-template {
    background-color: pink;
}

This will change your add to cart button color. 

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes

This is an accepted solution.

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

s.product-card__regular-price {
    color:  #5fbf00;
}
.product-card__price {
    color:  #5fbf00;
}

This will change your price color.

Add bellow code this will change add to cart button color on mouse hover:

#AddToCartText-product-template:hover {
	color: red;
}

 

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
0 Likes
Qualitycheck
Shopify Expert
1405 114 229

please share a store url to better assist

0 Likes
Jasoliya
Shopify Expert
4365 574 1100

This is an accepted solution.

Hi @mela2019 

Add this css in Asset->theme.scss file at bottom:

.btn:hover{background: black; color: white;}
.product-form__cart-submit{background: black;color: white;}

Note: Change color that you want.1st one is for whole store button and 2nd is for add to cart 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Vahow
Excursionist
23 0 8

@Jasoliya This solution worked perfectly. I have another question.

For add to cart button, the color changed perfectly. But when I hover mouse on the button, it changes to White Background again. How to change that color from white to any other color?

I'd really appreciate your response.

0 Likes
Jasoliya
Shopify Expert
4365 574 1100

Send me your store url will give solution

Best regard 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes