[Resolved] Filter by color price (WooCommerce)

[Pedro]

Hello! I would like to change the widget bar “filter by price” of WooCommerce.

Currently appears purple and I would like to put it blue (the original of generatepress)

Thank you!

GeneratePress 2.2.2

GP Premium 1.7.8

[David]

Hi there,

try this:

.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle {
    background-color: #0772c4;
}

.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content {
    background-color: #065A9B;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hello david!

It worked very well Thank you very much for the help!

[David]

You’re welcome

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hello David!

Sorry there is an error, now when I move the filter, the background appears purple.

You can see the screenshot: https://www.dropbox.com/s/esgc98d9ibcyuvx/IMG_2159.PNG?dl=0

[David]

Edited the code above 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hello david!

I’ve tried it and now it’s blue.

However it would be great if the widget showed the first blue lighter than the blue background (as does the default widget with light purple and dark purple)

Thank you!

[David]

Another edit above, the second rule sets the background color which i have reduced the lightness of.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hello david!

Many thanks! It worked perfect.

[Author]

Posts