Edit main files that generate index.php

[RaulNicolas]

I have encountered this problem several times with different objects. I want to change the color of the bar (for example), but is automatically generated in the index.php. There is no class in css. I try to find the files that generate the index.php but am unable to find it. I can´t find the kleo functions to edit them.
What should I do?

Attachments:

You must be logged in to view attached files.

[Laura]

Hello, could you share your website link? 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[RaulNicolas]

This reply has been set as private.

[Laura]

Hello, you can use this code to change the bar color
The bar between the selectors

COPY CODE

.woocommerce .widget_price_filter .ui-slider .ui-slider-range, .woocommerce-page .widget_price_filter .ui-slider .ui-slider-range, .woocommerce span.onsale, .woocommerce-page span.onsale {
  background: rgba(0, 0, 0, 0.23);
}

The full bar

COPY CODE

.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content, .woocommerce-page .widget_price_filter .price_slider_wrapper .ui-widget-content {
  background: rgba(0, 0, 0, 0.24);
}

Add it to quick css or style.css of child theme 🙂
Saludos!

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[RaulNicolas]

Thank you so much!!!
Saludos!!

[RaulNicolas]

Hello,

the next code works perfeclty in style.css (child):

.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content, .woocommerce-page .widget_price_filter .price_slider_wrapper .ui-widget-content {
background: rgba(0, 0, 0, 0.24);
}

but I can´t change the color between the selectors because It takes directly from ‘index’ code and It has higher priority. So, I should edit the widget to delete this part or what?

Thank you!!
Cheers

[Laura]

Hello, what part are you talking about? please share a screenshot so i can find it 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[RaulNicolas]

Hello,
if we take a look on the first post, we can see the problem in the screenshot. Upper right we find the element marked (the bar between selectors) and with the firebug plugin we can see the class. On the right we can see the class and the file from it gets the information. We see It gets from ‘(index):67’ not from a css file, so, it means is generated by a function or a template to build this part of ‘index’, isn´t?

When I put the code in the child style.css:

.woocommerce .widget_price_filter .ui-slider .ui-slider-range, .woocommerce-page .widget_price_filter .ui-slider .ui-slider-range, .woocommerce span.onsale, .woocommerce-page span.onsale {
background: #000000;
}

We should see the bar in black but the generated code is still the same and still getting the css code directly from index, not from child style.css.

The other code works perfectly in style.css:

.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content, .woocommerce-page .widget_price_filter .price_slider_wrapper .ui-widget-content {
background: red;
}

Thank you for your help!

[Laura]

Hello, try addint an !important right before ; of the code

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[RaulNicolas]

Hello, I can´t do anything in style.css if you are talking about that…

[Laura]

Hello, please try

COPY CODE

.woocommerce .widget_price_filter .ui-slider .ui-slider-range, .woocommerce-page .widget_price_filter .ui-slider .ui-slider-range, .woocommerce span.onsale, .woocommerce-page span.onsale {
  background: rgba(0, 0, 0, 0.23) !important;
}
.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content, .woocommerce-page .widget_price_filter .price_slider_wrapper .ui-widget-content {
  background: rgba(0, 0, 0, 0.24) !important;
}

If not please share admin credentials to check it out 🙂

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[RaulNicolas]

Hello,
Now It works perfectly!!!! Thank you so much!!

[Laura]

Awesome! If you are happy with the attention please give us 5 star rating or/and a nice comment on themeforest!

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[Author]

Posts