Knowledge Base

How to color code events based on calendar sources?

BoostSolutions’ Calendar Rollup collects and organizes calendar events from different calendar sources into one web part. You can also color code calendar events based on different calendar sources, to make it easy to identify and categorize information.

In this article, we will demonstrate how to color code events for different calendar sources.

WHAT YOU'LL GET

Color code events for different calendar sources on Web Part

WHAT YOU'LL NEED

The sample data we use for this case

Firstly, add Calendar Rollup Web Part to a SharePoint site as following.

Color-code events based on calendar sources

  1. Download the trial version of Calendar Rollup and install it to your SharePoint server.

  2. Navigate to site where you have added the Calendar Rollup Web Part to, on top right of Web Part, there’s an integrated dropdown menu, select Add Calendar.

    Or, click Calendar Rollup Settings and click Add new calendar in the Calendar Rollup Settings page.

  3. In the Add Calendar page, select the SharePoint list.

  4. In the Add or Change a Calendar page, specify a calendar name in General Settings section.

    In Specify a color for this calendar, select Custom color option, and then click color block for Specify Text Color option.

  5. When the color picker appears, select one color and click OK.

  6. You can select one color for the background in the same way, here we keep the default color for background. And then the color for the text and background are shown as following.

  7. In the Data source configuration section, configure the following settings.

  8. Keep other settings as default and click OK to add the calendar.

  9. And then click Add Calendar to add another calendar source – Exchange calendar.

  10. In the Add or Change a Calendar page, specify a calendar name in General Settings section.

    In Specify a color for this calendar, select Custom color option, and specify the color for the text and background as following.

  11. In the Data source configuration section, configure the following settings.

  12. Keep other settings as default and click OK to add the calendar.

  13. Navigate to the site where the Calendar Rollup Web Part locates, and then you will find that the events with different colors are shown as following.

    You can also add other calendar sources and mark as the different colors as the same way.

Login