Roberta
asked 5 years ago

Dear sirs, I’m trying to find the css selector for the cart and checkout buttons to change the color of background (you can see it in http://www.essse.it/shop/?post_type=product and hover the mouse on one of the products). Now is colored in red, but I can’t figure out how to change it (and only this type of button). Should I create another class with different properties? If this is the case, which php on js file should I modify to apply the new class?
Thank you!

5 Answers
DominicStaff
answered 5 years ago

Hi,
To resolve this issue, you can open the style.css file in the folder path “\wp-content\themes\dw-simplex\jigoshop”. Find the line 218 to line 304.
Hope this helps !

Roberta
replied 5 years ago

Hello Dominic, I noted there’s a gradient in the button’s css. Should I keep it or can i change to a flat color? Thank you…

Roberta
replied 5 years ago

Sorry again, I noted that the color in the style.css file you suggested is overwritten by the default theme color (I think). With Firebug I can see the color actually displayed is #af272f, but I searched the css file and I can’t see this color! How can I change the color of only these buttons?

DominicStaff
answered 5 years ago

You just need replace color code in the gradient as you saw in css file by your color code. Or you can use the following code to add css style, you just need put the following code in the style.css file of theme (wp-content\themes\dw-simplex)
/* Button —*/
.jigoshop .button,
.jigoshop .button-alt,
.jigoshop_login_widget .input-submit {
    <—–Your code——>
}
.jigoshop .button-alt,
.jigoshop .checkout.button,
.archive.jigoshop .product .product-actions .button {
     <—–Your code——>
}
.jigoshop_message .button {
     <—–Your code——>
}

.jigoshop .button:active,
.jigoshop .button:focus,
.jigoshop .button-alt:active,
.jigoshop .button-alt:focus,
.jigoshop .checkout.button:active,
.jigoshop .checkout.button:focus,
.archive.jigoshop .product .product-actions .button:active,
.archive.jigoshop .product .product-actions .button:focus,
.jigoshop_message .button:active,
.jigoshop_message .button:hover,
.jigoshop_login_widget .input-submit:active
.jigoshop_login_widget .input-submit:focus {
     <—–Your code——>
}
See the screenshot: http://prntscr.com/6428ls
If you still face there issue you cansend me your color that you want to change & a screenshot about position, I will help you resolve it.
Regards,
 

Roberta
answered 5 years ago

Hello Dominic,

here’s the color code I need : #ff9933.

I need it to be applied in the “ACQUISTA” button and the checkout button in the sidebar (wich now is called “CASSA”).

Here you can find the picture of the first button: https://www.dropbox.com/s/bynv4zgrhxnsq5y/DW-pic.png?dl=0

 

Thank you!

robertaleone
replied 5 years ago

Hello Dominic, any news regarding this problem? The client is complaining…

DominicStaff
answered 5 years ago

To resolve this issue, you can add the following code to the style.css file (Dashboard > Appearance > editor)

.jigoshop .button-alt, .jigoshop .checkout.button, .archive.jigoshop .product .product-actions .button {
    border-color: #ff9933 !important;
    background: #ff9933 !important;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlNDEzNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNTM0MjkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) !important;
    background: -moz-linear-gradient(top,  #ff9933 0%, #ff9933 100%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9933), color-stop(100%,#ff9933)) !important;
    background: -webkit-linear-gradient(top,  #ff9933 0%,#ff9933 100%) !important;
    background: -o-linear-gradient(top,  #ff9933 0%,#ff9933 100%) !important;
    background: -ms-linear-gradient(top,  #ff9933 0%,#ff9933 100%) !important;
    background: linear-gradient(to bottom,  #ff9933 0%,#ff9933 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9933', endColorstr='#ff9933',GradientType=0 ) !important;
}

.archive.jigoshop .product .product-actions .button {
    border-color: #ff9933 !important;
    background: #ff9933 !important;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlNDEzNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNTM0MjkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+) !important;
    background: -moz-linear-gradient(top,  #ff9933 0%, #ff9933 100%) !important;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9933), color-stop(100%,#ff9933)) !important;
    background: -webkit-linear-gradient(top,  #ff9933 0%,#ff9933 100%) !important;
    background: -o-linear-gradient(top,  #ff9933 0%,#ff9933 100%) !important;
    background: -ms-linear-gradient(top,  #ff9933 0%,#ff9933 100%) !important;
    background: linear-gradient(to bottom,  #ff9933 0%,#ff9933 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9933', endColorstr='#ff9933',GradientType=0 ) !important;
}
.jigoshop .checkout.button:active,
.jigoshop .checkout.button:focus,
.archive.jigoshop .product .product-actions .button:active,
.archive.jigoshop .product .product-actions .button:focus {
    background: #333 !important;
    border-color: #333 !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#333333',GradientType=0 ) !important;
}

Hope this helps !

Roberta
answered 5 years ago

I added this code to my website (I tried in the main style.css file and in the theme one), but I see no difference.
Can you please modify the files required so, after more than 1 month, I can have the color I’m asking for?
This issue is really driving me crazy; I get no answers from you, no notifications for replies, the suggested code never works and my client is complaining every day… twice a day.
Can you please help me asap???

DominicStaff
answered 5 years ago

I know the issues which you facing. But, I think you have confused somewhere, I have checked on our demo and still work fine, nothing happens. Just added the code to style.css file (Dashboard > Appearance > Editor)
See the screenshot: http://prntscr.com/6ht1pc
View page: http://prntscr.com/6ht1ss , http://prntscr.com/6ht1z0
If you still face their issue, you should send me username & password of your site (via private answer), I will help you resolved it.
Regards,

Powered by DW Question & Answer Pro