Calendar Widget

[Jennifer]

In my theme your calendar widget looks great however it would be nice to change the background color of a day that has events. I would like those days to stand out more. Also It would be nice to have the same css custom color per category. For example if we are closed a day I would like that to be one color, charity another color and member only event another.

[Jonah]

Hi Jennifer,

This is possible to highlight the days but will require some PHP/CSS changes. The first change needs to be made in /wp-content/plugins/the-events-calendar/views/table-mini.php – make a copy of that and place in an ‘events’ folder in your active theme’s folder. Then find line 125 that should read: http://snippi.com/s/u1jz363

…and change to:

http://snippi.com/s/mk9zvn9

That will add the ‘has-events’ class to the div for the days that have events. Then, in your theme’s style.css file just add for example:

.tribe-events-calendar-widget .daynum.has-events {
background: #ccc;
}

…which will give days that have events a background color of #ccc. That should get you a good start with this. Feel free to apply any styling you want.

As for category colors, you might try this plugin: http://wordpress.org/extend/plugins/the-events-calendar-category-colors/

I hope that helps!

– Jonah

[Author]

Posts