Modifying Filter Checkboxes / Radiobuttons

[bizzallmedia]

Hi,
Hope you all had an amazing xmas!
Last week bought a bundle and found out the event aggregator is not working as it should and as no one knows how long its gonna take to get it fixed by the dev department decided to start to play around a bit with some other stuff while waiting for an update on the fix.

Would like to modify the way the radio buttons and checkboxes function in the filter, in particular for the category filter.
I am aware that you are limited by your support policy but hope you can head me in the right direction as I have been trying to get my head around this now for hours now and can’t seem to get it to work, and belief it really shouldn’t be that complicated.

Working on a clean install with only Event Calendar Bundle installed, no themes & other plugins, so there’s also no conflicts from other parts.

Through the forum managed to find a snippet to only view the category filter open without anything else as seen on some other sites. And created the filter-view.css in the child theme for twenty….. so was thinking it was a simple matter of modifying the relevant css classes in there but it doesn’t seem to work, not sure if I have the wrong classes or wrong syntax, but can’t get it to work like any of the examples I would like to be able use…..

So would like to change it to something like any of the following:
https://codepen.io/jmar/pen/jWWKbb
https://codepen.io/paul66/pen/jKBzu
or maybe even this… https://codepen.io/raubaca/pen/ONzBxP

Any suggestions on how to implement this?
Thanks

[Brendan]

Hi there,

Have you taken a look at our themer’s guide? We do not support custom development but this may be helpful.

Let me know if that works.

Thanks,
Brendan

[bizzallmedia]

Hey,
Yes looked into that.
Note I am somewhat of newbie at this stuff but am up for a challange 🙂

From what I have found from the guide and this forum support posts it’s a bit confusing as to why the php files for customising the Filter Bar need to go to mytheme/tribe-events/filter-bar (with the “-“) and the css file for customising needs to go to mytheme/tribe-events/filterbar.(without the “-“)
Am assuming that this is the way it has been standardised just don’t see the point to have to folders in my child-theme to modify the same thing.

Also from all this, still have not been able to figure out how to modify it…

Tried this for example andit did nothing….
`
#tribe_events_filters_wrapper label input[type=checkbox],
#tribe_events_filters_wrapper label input[type=radio] {
display: none;
}

#tribe_events_filters_wrapper input:checked + label,
#tribe_events_filters_wrapper input:checked + label:active {
background-color: salmon;
}

#tribe_events_filters_wrapper label:hover {
background-color: gold;
cursor: pointer;
}`

[Brendan]

Hi there,

Can you try adding !important to your css and add this css in the style.css file of your theme?

#tribe_events_filters_wrapper label input[type=checkbox],
#tribe_events_filters_wrapper label input[type=radio] {
display: none !important;
}

#tribe_events_filters_wrapper input:checked + label,
#tribe_events_filters_wrapper input:checked + label:active {
background-color: salmon !important;
}

#tribe_events_filters_wrapper label:hover {
background-color: gold !important;
cursor: pointer !important;
}`

Let me know how that goes. If you could provide the domain as well, that would be great.

Thanks,
Brendan

[bizzallmedia]

Hi!
Happy New Year!

Tried both adding it to the style.css (as your suggested) and to the filter-view.css (as suggested by the theming guide)

None of them did anything to the styling.

[bizzallmedia]

And sadly can’t provide the domain as I am working on a local mamp dev setup

[Brendan]

Hi there,

Maybe I am a little confused. So you are trying to change the background color of the label?

Based on what you are say, here is what I think. Try this out and let me know if we are on the same page:

#tribe_events_filters_wrapper .tribe-events-filter-group label:hover

Thanks,
Brendan

[Support Droid]

Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

Thanks so much!
The Events Calendar Support Team

[Author]

Posts