Colored Calendar in Sharepoint 2013

Question

Hello,
I have tried every solution to get my Calendar for SharePoint 2013 to have colors for different event types, but to no avail.  Overlays don't work since the calendars are based off of a list item, not a calendar item. Overlay is just not an option in
that case.  I am putting my calendar on a page with other APPs, that seemed to have messed up the color options to begin with.  I guess in that case I created a calendar with Overlays, and then inserted that into a page with other items.  When
I did that the overlay colors disappeared.
When I tried this one ttp://social.technet.microsoft.com/Forums/sharepoint/en-US/ca331954-0771-4fc9-9c9e-b7efca6114f8/color-code-calendar-by-category?forum=sharepointdevelopmentprevious
         (I had to remove the first "h" since it wouldn't let me insert a link until my account is verified, and I didn't know how else to not have it automatically create it as a link here).
I noticed this warning in Dimitri's description ... could this be what is causing my problems?
     "Caution: The jQuery JavaScript library must be available in your environment."
How do I know if the JQuery JavaScript library is available? 
I'm not sure what to try next.  I don't want to move forward with my program until this gets figured out, since it is so important to the project.
Thank you, Liz.

Answer 1

Check if below can help
http://www.sharepointbreak.com/2012/09/02/creating-a-color-coded-calendar-by-category-using-js-in-sharepoint-2010/
function ColourCalendar() {
if(jQuery('a:contains(' + SEPARATOR + ')') != null)
jQuery('a:contains(' + SEPARATOR + ')').each(function (i) {
$box = jQuery(this).parents('div[title]');
var colours = GetColourCodeFromCategory(GetCategory(this.innerHTML));
var colour = colours[0];
//colour += "!important";
var Fontcolour = colours[1];
this.innerHTML = GetActualText(this.innerHTML);
jQuery($box).attr("title", GetActualText(jQuery($box).attr("title")));
$box.css('background-color', colour);
$box.children().css('color', Fontcolour);
// I've added this condition since the font color did not catch on to a a:link unless i used !important
//if (Fontcolour == 'white')
//$('a:link', $box).css("cssText", "color: white !important;");
function GetColourCodeFromCategory(category) {
var colour = null;
var Fontcolour = null;
switch (category.trim().toLowerCase()) {
case 'category1':
colour = 'green';
Fontcolour = 'black';
break;
case 'category2':
colour = 'blue';
Fontcolour = 'white';
break;
case 'category3':
colour = 'yellow';
Fontcolour = 'black';
break;
return [colour, Fontcolour];
CSS, javascript & calculated columns should do the trick. Read the following posts:
Tutorial: add color coding to your SharePoint 2007 calendar in 15 minutes
Colour coded SharePoint 2010 Calendar
If this helped you resolve your issue, please mark it Answered