Change CSS without affecting the plugin

Hi Filipe,

You can add styles to your theme’s style.css file and they will overwrite plugin’s styles. Please use FireBug https://addons.mozilla.org/ru/firefox/addon/firebug/ or any other development tool to check ids of elements you want to change.

Regards,
Dima

Hi!

On my style.css child theme I added

.berocket_filter_slider.ui-widget-content .ui-slider-range, .berocket_filter_price_slider.ui-widget-content .ui-slider-range {
background: none repeat scroll 0px 0px #0088cc;
}

To change the original price slider color from #000 to my color #0088cc but it does not work.

I also tried to change the margin from:

.berocket_aapf_widget-title {
margin-bottom: 5px;
font-size: 14px;
}

to

.berocket_aapf_widget-title {
margin-bottom: 0px;
font-size: 14px;
}

but nothing. If i change these values in Firebug or the default Firefox developer tools i can see the effect on my website, but if i upload them on style.css nothing happens.

I’m also trying to reduce the space between the filter labels, because its a lot of blank space, but i’m unable to see what i have to change.

Thanks again!

Hi Filipe,

Can you remind me please link to your site?

Regards,
Dima

Filipe,

As I see your css is ok but it has lower priority than plugin’s one. Add html before, like
html .berocket_filter_slider.ui-widget-content .ui-slider-range, html.berocket_filter_price_slider.ui-widget-content .ui-slider-range {

This will rise weight of your style. Or you can use !important, like
background: none repeat scroll 0px 0px #0088cc !important;

But first way is better.

Regards,
Dima

Hi, my website is still in construction, but i will provide a link latter when its finished!

That html did it, your awesome ??

Can you help with the css for the widget that controls the space between the last filter option and the next filter label so i can reduce it? I can’t seem to find it…

OK i think i got it:

ul.berocket_aapf_widget{
margin-bottom: 30px;

I belive i can even change the margin to a negative value so that the space gets really small, because even if i add 0px it has space, can i have any problem doing that?

This however creates the problem that the last AAPF widget also have a very little space tom my other WC widgets… Any way i can fix that?

Thanks again!

Hi Filipe,

Widget that goes after last filter has some class too, check it with firebug. Add to that class top padding or margin.

Regards,
Dima