Quote from Alex Dovlatov on December 11, 2025, 13:18

Hello Martial

Add next please code into file functions.php of the current wp theme:

add_action('wp_enqueue_scripts', 'husky_custom_slider_colors', 999);
function husky_custom_slider_colors() {
// Slider color settings
$slider_color = '#000000'; // Main slider color (black)
$slider_hover_color = '#333333'; // Hover color (dark grey)

// Font settings
$label_font_family = 'Arial, sans-serif'; // Font family for filter labels
$label_font_size = '16px'; // Font size for labels
$label_font_weight = '600'; // Font weight for labels
$label_color = '#333333'; // Label text color

$option_font_size = '14px'; // Font size for filter options
$option_color = '#666666'; // Text color for options

$custom_css = "
/* Ion Range Slider - change #ed5565 to custom colors */
.irs-bar {
background: {$slider_color} !important;
}
.irs-from, .irs-to, .irs-single {
background: {$slider_color} !important;
}
.irs-from:before, .irs-to:before, .irs-single:before {
border-top-color: {$slider_color} !important;
}
.irs-slider {
background: {$slider_color} !important;
border: 2px solid {$slider_color} !important;
}
.irs-slider:hover {
background: {$slider_hover_color} !important;
}
.irs-grid-pol.small {
background: {$slider_color} !important;
}

/* Filter labels font control */
.woof_container .woof_block_html_items h4,
.woof_container .woof_redraw_zone h4 {
font-family: {$label_font_family} !important;
font-size: {$label_font_size} !important;
font-weight: {$label_font_weight} !important;
color: {$label_color} !important;
}

/* Filter options text */
.woof_container .woof_list li label,
.woof_container .woof_checkbox_label {
font-family: {$label_font_family} !important;
font-size: {$option_font_size} !important;
color: {$option_color} !important;
}

/* Price slider labels */
.woof_price_search_container .woof_price_search_text {
font-family: {$label_font_family} !important;
font-size: {$option_font_size} !important;
}
";

wp_add_inline_style('woof-ion-range-slider', $custom_css);
}

 

Let me know how it works. Welcome!

Quote from Martial on December 11, 2025, 13:43

Good day Alex,

I am using Wpcodebox to add CSS snippet into my website.

I added the CSS but so far don't see any change.

I can provide you with admin access to my website if you need to check things on your end.

Quote from Alex Dovlatov on December 12, 2025, 12:21

Hello Martial

Yes, share please wp-admin aceess and I will play with the code

https://share.pluginus.net/image/i20230222134241.png
https://share.pluginus.net/image/i20230222134615.png
https://share.pluginus.net/image/i20230222134511.png

 

Quote from Martial on December 12, 2025, 12:42

thank you, i sent you admin access

Quote from Alex Dovlatov on December 12, 2025, 16:01

Hello Martial

Here it is: https://www.lepontdelamour.fr/wp-admin/theme-editor.php?file=functions.php&theme=blocksy-child

I changed code:

add_action('wp_footer', function () {
// Only output on pages where WOOF/HUSKY is active
if (!class_exists('WOOF')) {
return;
}

// Slider color settings
$slider_color = '#000000'; // Main slider color (black)
$slider_hover_color = '#333333'; // Hover color (dark grey)
// Font settings
$label_font_family = 'Arial, sans-serif';
$label_font_size = '16px';
$label_font_weight = '600';
$label_color = '#333333';
$option_font_size = '14px';
$option_color = '#666666';
?>
<style id="husky-custom-colors">
/* Ion Range Slider - change #ed5565 to custom colors */
.irs-bar {
background: <?php echo esc_attr($slider_color); ?> !important;
}
.irs-from, .irs-to, .irs-single {
background: <?php echo esc_attr($slider_color); ?> !important;
}
.irs-from:before, .irs-to:before, .irs-single:before {
border-top-color: <?php echo esc_attr($slider_color); ?> !important;
}
.irs-slider {
background: <?php echo esc_attr($slider_color); ?> !important;
border: 2px solid <?php echo esc_attr($slider_color); ?> !important;
}
.irs-slider:hover {
background: <?php echo esc_attr($slider_hover_color); ?> !important;
}
.irs-grid-pol.small {
background: <?php echo esc_attr($slider_color); ?> !important;
}

/* Filter labels font control */
.woof_container .woof_block_html_items h4,
.woof_container .woof_redraw_zone h4 {
font-family: <?php echo esc_attr($label_font_family); ?> !important;
font-size: <?php echo esc_attr($label_font_size); ?> !important;
font-weight: <?php echo esc_attr($label_font_weight); ?> !important;
color: <?php echo esc_attr($label_color); ?> !important;
}

/* Filter options text */
.woof_container .woof_list li label,
.woof_container .woof_checkbox_label {
font-family: <?php echo esc_attr($label_font_family); ?> !important;
font-size: <?php echo esc_attr($option_font_size); ?> !important;
color: <?php echo esc_attr($option_color); ?> !important;
}

/* Price slider labels */
.woof_price_search_container .woof_price_search_text {
font-family: <?php echo esc_attr($label_font_family); ?> !important;
font-size: <?php echo esc_attr($option_font_size); ?> !important;
}
</style>
<?php
}, 999);

 

Now it looks:

 

Welcome :)

Quote from Martial on December 17, 2025, 11:36

Good day and thank you very much for your action and input.

My feedback :

• is it possible to also change the color of the delimiter (in red still) on the slider.
• I changed the black ionto gold and it works
• I can't find a way to adapt the font size of the label to exactly match the one for "Votre Recherche".

Instead of amending child them php file would it be easier to use Php snippet via wpcodebox?

 

Quote from Martial on December 18, 2025, 16:32

My client wants something more discreet an choosed your "sharp" slider template.

Would you mind providing me the code to amend color on side (currently in purple, ideally in gold)

Also my main request is still one: your code is amending font type but not font size or font weight it seems.

screnshot here :https://imgur.com/a/bIduD37