Home › Forums › Calendar Products › Filter Bar › Adding custom styles alongside default Filter Bar stylesheet
- This topic has 7 replies, 2 voices, and was last updated 9 years, 11 months ago by Casey.
-
AuthorPosts
-
April 13, 2014 at 9:02 am #131998irishrunner16Participant
I want to make some changes to the Filter Bar’s CSS. I can’t seem to find any documentation on how I can add custom styles and alongside the default Filter Bar stylesheet. Putting changes for Filter Bar in tribe-events.css doesn’t work because filter-view.css is loaded after the TEC and PRO stylesheets.
For TEC I know its simply creating a stylesheet called tribe-events.css in the tribe-events/ directory of my theme, while for PRO its tribe-events-pro.css in tribe-events/pro/. Where should I create a custom stylesheet for the Filter Bar, and what should the file be named?
Thanks,
SeanApril 15, 2014 at 5:58 am #133027CaseyParticipantSean,
Thanks for getting in touch! Sorry for the confusion! You should just be able to put your Filter Bar Override styles into tribe-events.css, since that stylesheet is enqueued whenever the filter bar is being displayed. Give that a shot and let me know if you have further questions. Thanks! 🙂-Casey-
April 15, 2014 at 12:35 pm #133407irishrunner16ParticipantThis reply is private.
April 15, 2014 at 2:56 pm #133500CaseyParticipantSean,
It looks like the filter bar styles get enqueued after the override styles, but you should be able to get around that by completely removing the filter bar styles by adding the following to your theme’s functions.php file: https://gist.github.com/ckpicker/10780176This will completely prevent the Filter Bar styles from being enqueued, so you can specify your own styles. Give that a shot and let me know if it does the trick. Thanks! 🙂
-Casey-
April 16, 2014 at 5:36 pm #134312irishrunner16ParticipantOk, just want to make sure I’m understanding this correctly…
So to add custom styles for the Filter Bar I’d have to:
1. Add the function you created above to my functions.php file,
2. Copy the default styles from filter-view.css into my tribe-events.css file,
3. Make my customizations to the Filter Bar styles that are now in tribe-events.cssApril 17, 2014 at 6:47 am #134959CaseyParticipantThat’s correct Sean. The code I shared with you will basically prevent the filter-view.css file from loading at all. So, you’ll want to add those styles (along with your customizations) to tribe-events.css to make sure everything looks good.
As with any customization, keep in mind that you’ll need to perform backups and thoroughly test things when updating the plugin, since some of your customizations might not work correctly due to things changing in the codebase.
Give that a shot and let me know if it does the trick. Thanks! 🙂
-Casey-
April 19, 2014 at 5:20 am #137156irishrunner16Participantok thanks Casey!
April 21, 2014 at 8:13 pm #139064CaseyParticipantSean,
Thanks for confirming that this got you sorted. Since it looks like you’re all set, I’m going to mark this thread “Answered” and close it out.By the way, if you have a minute or two, we would love it if you’d write a few words for us here: http://wordpress.org/support/view/plugin-reviews/the-events-calendar?filter=5
Thanks in advance. 🙂
Cheers,
Casey -
AuthorPosts
- The topic ‘Adding custom styles alongside default Filter Bar stylesheet’ is closed to new replies.