Support

January 22, 2019 at 4:23 am

Hi there,

Can you confirm the categories are still sorted alphabetically?

They are not, can I ask where you saw this?

It yes, can you tell us what to check to verify our instance is sorting alphabetically?

The calendar uses $event->get_all_event_categories(); to pull the categories and it is ordered by ID, that returns an array of categories assigned to the event and the calendar then pulls the ‘first’ element as the primary category and uses that for colours.

So the reason your first example does not work is that the category you are using for the colours has a higher ID, meaning it will be second in the array.

The second example has a lower ID, so its ‘first’.

To test you can do this:

$event = EEM_Event::instance()->get_one_by_ID(129);
$event_cats = $event->get_all_event_categories();
//This will show the query used to pull in the categories.
echo $wpdb->last_query;
//This shows the array returned from the above, 
var_dump($event_cats);

Obviously, you change 129 to the ID of the event you want to test and you can run that within Debug Bar using Debug Bar Console.

If you want to confirm which category would be used from the above, it’s the first element in the array, the calendar uses reset() to pull that from the array so something like:

$prmary_category = reset($event_cats);
var_dump($primary_category);

Add that at the bottom of the above snippet and it will show you the category that will be used.

January 22, 2019 at 11:00 am

Thank you for the link.

The problem is that filter is for the EE3 version of the calendar (which did eventually sort the categories alphabetically), as you are using EE4 that isn’t available as it stands.

So aside from deleting/editing categories so the “color categories” have a lower ID, there is no other method of changing the order?

Not for changing the order no, but you can add some CSS to force the calendar to display the correct colour.

So for example, you could use:

#espresso_calendar .light-blue {
    background-color: lightblue !important;
    border-color: #fff !important;
}

Then make sure that the calendar adds all of the categories classes to the event, you do this in the settings for the calendar:

Event Espresso -> Calendar -> Basic Settings.

Make sure ‘Enable CSS for Categories’ is set to Yes.

What that does is loop over every category on the event and adds it as a class on the output, so the above would then target a category of light-blue and hardcode the background colour using !important.

I can add a feature request to add a filter on the categories returned by the above in the calendar, so you could then hook into that and set the order however you prefer to do it that way?

January 22, 2019 at 2:47 pm

This technique of using two categories, one with color, is an indirect way of assigning a specific color directly to a specific event.

Then you can do it with one category and target that specific category in the same way as above.

The feature we’d really like is the ability to set color directly on an event.

Assuming you have a method to set a colour on the event through a custom field (ACF for example)? You can do that with the filters already available within the calendar add-on.

FHEE__EE_Calendar__get_calendar_events__calendar_datetime filters each individual calendar datetime (which each basically each individual instance on the calendar) and passes the calendar datetime and datetime object to the filter.

You can pull the event object from the datetime and then the custom colour you set on the event and assign it back to the calendar datetime.