I would like to color code the day cell according to the event category. I have 4 categories Islamic, TRA, Global and UAE.Following is a screenshot of the calendar I would like to have. enter image description here

Can anyone help me with an example code that does this.

  • It would be helpful if you could include your template code as it currently stands. Commented Sep 30, 2013 at 1:11

2 Answers 2


On the {exp:calendar:cal} tag, I believe you could do enable="categories". You could then output the category for each event with class="category{categories}{category_id}{/categories}" and then just create some CSS to apply the colour for each class - such as category1, category2 etc.

Something like that might work.

  • Thank you. I have implemented it and it is working. However, I would like to change the day format from Sunday, Monday to Sun, Mon..
    – user2121
    Commented Oct 2, 2013 at 7:44

I had to do something similar but categories were being used for something else, so in the calendar setup I split event categories into separate calendars and then used the events calendar ID to create class names as explained above. Same solution, different route.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.