Reply To: Custom Styling for filters

[Ernest Marcinko]

Hi Paul,

Could be doable, but will require a custom script as well.

Try adding this custom code to the functions.php in your theme/child theme directory. Before editing, please make sure to have a full site back-up just in case!

add_action("wp_footer", "asp_mark_options_checked");
function asp_mark_options_checked() {
	?>
	<script>
	jQuery(function($){
		$('.asp_w input[type=checkbox]').on('asp_chbx_change', function(){
			console.log($(this).prop('checked'));
			if ( $(this).prop('checked') ) {
				$(this).closest('.asp_option').addClass('asp_selected_option');
			} else {
				$(this).closest('.asp_option').removeClass('asp_selected_option');
			}
		});
	});
	</script>
	<?php
}

This will add the asp_selected_option class to the option container, where the checkbox is checked. Now you can use that to change the properties of the selected one via CSS:

.asp_selected_option .asp_option_label {
    color: cyan !important;
}