Thursday, November 5, 2009
SharePoint Color Coded Calender
SharePoint calender can display the items in color and that too without creating any complicated code.
Steps are:
1.Create or open a calendar
2.Add a new column named "Color" (Settings, List Settings) – most likely type will be "Choice" with choices like "Red, Green, Blue, Black", but this could be a lookup or a single line of text.
3.Add a new column named "CalendarText"
type is Calculated
equation is
="<'font color='" & Color & "''>" & Title & "<'/font'>"
data type returned = single line of text
4.Modify the existing view, or create a new view such as "Color Calendar"
Change the field used for the month view to "Calendar Text"
Save and exit
5.Add a Content Editor web part
Site Actions, Site Settings, Edit Page
Add a Content Editor web part and move it below the calendar web part
Click in the web part click Edit, Modify Shared Web Part
Click Source Editor
6.Paste this JavaScript
<'script type="text/javascript" language="javascript"'>
var x = document.getElementsByTagName("TD")
var i=0;
for (i=0;i<'x.length;i++')
{
if (x[i].className.substring(0,6)=="ms-cal")
{
x[i].innerHTML= x[i].innerHTML.replace(/</g,'<').replace(/>/g,'>')
}
}
<'/script'>
7.Click Save, OK, Exit Edit Mode
8.Add a new calendar item and select a color.
Note: Remove every single quote written after < html tag.
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment