Support

February 3, 2025 at 10:25 am

Hi there,

How are you separating the different types of events currently?

I’m guessing using more categories?

February 4, 2025 at 4:08 am

Yeah I fugred you would have 2 ‘main’ categories os something similar to ‘recreational’ and ‘commercial’.

However, you mentioned this;

…but in each category i have multiple types of events.

So how are you differentiating those within your site? Or are you not doing so currently?

As in you could have A parent category of ‘recreational’ with child categories of ‘type 1, type 2, type 3’ etc.

I’m asking becuase if you use categories for the ‘types’ you can set the calendar to include the calendar slugs as classes on the events showing in the calender, then use some CSS to apply colours to those.

February 4, 2025 at 6:03 am

The calendar itself will only pull in one primary category (the first) for a colour, that’s why I mentioned you’ll need some CSS above.

Can you link me to the page so I can take a look?

February 4, 2025 at 6:52 am

So you’ll need to use something like this:

#espresso_calendar .fc-event.{category-slug} {
    background-color: red !important;
}

So a quick example for dock-pro:

#espresso_calendar .fc-event.dock-pro {
    background-color: red !important;
}

You can set the colours using the hex value you set in the colour pickers earlier if preferred, just copy the value over in place of red above. Create the above for each of your category slugs for the ‘types’ and add them to Appearance -> Customize -> Additional CSS.