Calendar and Events web part (color coded SharePoint calendar)

Calendar web part connect to your Events list on the SharePoint site and makes it incredibly easy for users to pick any date or range on a calendar and see related events

Here is an example of the Calendar web part:

All the event content such as Categories, Events, and Dates come from your existing Events list, so it’s easy to just add the web part to the page and it’ll pull events right in.

The link will take users to familiar SharePoint event page:

Setting up the web part

Edit the page where you want to see the Calendar, and pick this app from the gallery:

Adding new events

You can add a new event by editing the page where the Calendar web part is on, going to web part properties and clicking the Add an Event button:

Setting default date range

By default, the web part will show readers any events from today’s date to the end of the month.
You can change that by going to web part properties and selecting:

In here:
-this month(default) - shows all events from today till the end of the month
-this week - shows all events from today until 7 days from today
-today - shows todays events

You may want to tweak this depending on the volume of events you have posted on your site

Color coding your calendar

You can color code each category in your calendar.
By default, Events list already has categories defined, and you can change them by going to Events list settings, like this:
From here, you can define the list of available categories:

So how do you map colors to those categories?

Simply go wo Origami Calendar web part properties and click this button:

From here you can map each category to any desired color:

Save the web part properties and the page to see changes.

Changing calendar styles

In addition to color coding your events, you can also change the date picker colors using these web part properties: