Custom URL + active search styling

[sarah_tJOd]

Hello

I’m trying to do two things I can’t work out on this page https://writershqtest.wpenginepowered.com/writing-courses/

1. I want a custom URL, so when you click, say, publishing, the url would show something like https://writershqtest.wpenginepowered.com/writing-courses?_courses_categories=publishing

2. For the relevant button to be a different colour when those search results are showing, eg when I click publishing, I get the publishing search results, and that button is a darker blue. I can’t find an ‘active’ class in the css.

Thanks 🙂

[Ernest Marcinko]

Hi!

1. You can sort of do that via this option. However the parameter names are automatically generated from the form values and object IDs. Visiting the generated URL will preset the values of the filter.

2. Sure! It’s the .asp_option_checked class, use it like this:

.asp_option_cat.asp_option_checked {
    background: #206177 !important;
    color: #e8eff1 !important;
}

[sarah_tJOd]

This is great, thank you. You even used my colours in the example!

Previously you gave me this code to make my checkboxes horizontal

fieldset.asp_filter_tax {
    max-width: unset !important;
    width: 100% !important;
}
fieldset.asp_filter_tax>div {
    display: flex;
    flex-wrap: wrap;
}

but it doesn’t seem to work for radio buttons – I can’t see that the classes should be different though. Is there an alteration for radio boxes pls?
Thanks

[Ernest Marcinko]

You are welcome 🙂

Radio button output is a bit different, there is a line break you have to “remove” basically:

fieldset.asp_filter_tax {
    max-width: unset !important;
    width: 100% !important;
}
.term_filter_box br {
    display: none;
}

[Author]

Posts