# Color-Coded SharePoint & Microsoft 365 Group Calendar

**URL:** <https://community.origamiconnect.com/t/color-coded-sharepoint-microsoft-365-group-calendar/416>\
**Category:** How-Tos & Manuals for Origami Connect\
**Created:** [April 12, 2023, 11:29pm UTC](https://community.origamiconnect.com/t/color-coded-sharepoint-microsoft-365-group-calendar/416 "2023-04-12T23:29:27Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![origami](https://yyz1.discourse-cdn.com/flex031/user_avatar/community.origamiconnect.com/origami/32/436_2.png) [@origami](https://community.origamiconnect.com/u/origami)\
**Post date:** [April 12, 2023, 11:29pm UTC](https://community.origamiconnect.com/t/color-coded-sharepoint-microsoft-365-group-calendar/416/1 "2023-04-12T23:29:27Z")

</div>

> Calendar web part shows rolled up, color-coded events from any SharePoint site, Microsoft 365 group or shared calendar. Users can pick any date or range and RSVP for an event.
> 
> Here is an example of the Calendar web part:

![Calendar](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/4/4ef89a819028a6ff2c0cafcc7c874c18684caac2.gif)

Edit the page where you want to see the Calendar, and pick this app from the gallery:  
 ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/8/807a1429c8df5cebb2037eee38d4306079589673.png)

[  
Setting Up Your Calendar in Origami 📅 - Watch Video  
  ![](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/0/018bcffac686bfe75f7150ef4e2e197530c99b19.gif)](https://www.loom.com/share/496973d5ec614f07ac4e533f2e59e3b5)

> **Adding new events**
>
> You can add a new event by going to your SharePoint event list and creating an event there.
> 
> ### Use an Event list, not a standard SharePoint list
> 
> The Origami Calendar web part requires a SharePoint **Event list**.
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/f/f980647d4c6f5cd0cfc0e10dcf44017734d4417f.jpeg)
> 
> A standard SharePoint list will not work because the Calendar web part relies on event-specific columns that are not available in a regular list.
> 
> If you need to create a new Event list:
> 
> 1. Go to an existing Event list.
> 
> 2. Click the ellipses **(…)** next to the list.  
> 
> 3. Select **Details**.
> 
> 4. Click **Add It**.  
> 
> 5. Enter a name for the new calendar.
> 
> 6. Click **Create**.  
> 
> This will create a new Event list that can be used with the Origami Calendar web part.

> **Calendar sources**
>
> **Reading Events from another site or Microsoft 365 group**
> 
> The calendar can read from:
> 
> - URL of any SharePoint site
> - Microsoft 365 Group
> 
> All events will be rolled up in a single view as long as the user has access to them.
> 
> To set that up, navigate to the web part properties as shown below to pick the source for your events:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/c2ee0933a377bb245ebda5d00dbcfdd85d3b47ee.png)
> 
> In case you need to read the events from a Microsoft 365 Group, you’ll also need your IT administrator perform these one-time steps: [Enabling Calendar web part to read from Microsoft 365 group](https://community.origamiconnect.com/t/enabling-calendar-web-part-to-read-from-microsoft-365-group/464)
> 
> * * *
> 
> **Filter by SharePoint View**  
> _Available in Calendar – Version Sep 22, 2025_
> 
> The Calendar can now pull events from a specific SharePoint View.
> 
> - **Set a View URL** : Use the URL of your saved SharePoint view (with filters applied).
> - **Display Events from that View Only** : The Calendar will now show only those filtered events.
> 
> This allows you to:
> 
> - Highlight department-specific events on a department page
> - Focus on location-based schedules
> - Show only the categories that matter for your audience
> 
> **How to set it up:**
> 
> 1. Go to your Calendar web part properties.
> 2. In the Source settings, paste the **View URL** instead of the default list URL.
> 3. Save your page.  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/8/85b2d7c1d2776b41943d0f9645bb14e48b6e2932.png)
> 
> * * *
> 
> **Multiple calendars on a single site**
> 
> You can have more than one calendar showing events from separate Calendar lists.  
> To do that, first we need to create a second calendar list:
> 
> 1. Click **(\*)** → **Site contents**
> 2. Find the **Events** list, click on **(…)** next to it, and select **Details**
> 3. Click the **Add It** button and when prompted, give your new calendar a name. For example: **HR Calendar**
> 4. Click **Create**
> 
> Now you can populate this list as you see fit.  
> To link this new list to a different calendar on your page
> 
> 1. Add the **Calendar** Origami web part
> 
> 2. In the web part properties, under **Source of Events** , set the Calendar list with the same name as given in step 3 earlier. For example: **HR Time Off**  
> 
> 3. Save the page and you’re all set.

> **Date range and display settings**
>
> **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:  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/e5273d69428b4f83abd35a0d4e6778851dc63020.png)
> 
> In here:  
> -today - shows today’s events  
> -this week - shows all events from today until 7 days from today  
> -**this month(default)** - shows all events from today till the end of the month  
> -this quarter - shows all events from today until last days of month 3 from now  
> -this year - shows all events from today till the end of the year
> 
> You may want to tweak this depending on the volume of events you have posted on your site
> 
> * * *
> 
> **Events showing wrong date or time?**
> 
> By default, the calendar will display events in users locale (setting on their computer).  
> You might need to update your calendar locale setting so calendar knows which timezone you’d like to show.  
> To do that, go to web part properties and adjust locale as follows:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/a/abd97e7cd683a088fc93a78f824866ad51eb87cb.png)
> 
> Here is the list of acceptable timezone codes (look under TZ identifier in the table) [https://en.wikipedia.org/wiki/List\_of\_tz\_database\_time\_zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones)

> **Tracking RSVPs**
>
> Knowing who’s coming to an event can help organizers plan seating, food and other logistics.  
> Here is an example of how some one can RSVP for an event:  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/c77759ac7af72a301002f50697650da887fad2a5.png)
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/984b0004d605b39a3ea0358c77469495605eff7d.png)
> 
> Here is how to enable this:
> 
> 1. In Calendar web part properties, click **Enable RSVP**
> 
> 2. Click the **Create RSVP List** button. All RSVPs will be tracked in RSVP list on the SharePoint site.  
> You can access the list directly from **Site contents** or by clicking **See All RVSPs** as shown below:  
> 
> 3. Finally, ensure users can “write” to RSVP list  
> 3.1 From the RSVP list, click **(\*)** → **List settings** → **Permissions for this list**  
> 3.2 In the ribbon, click **Stop Inheriting Permissions**  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/aa387233abb65467be07e8f9c0b0bc0c58ea8014.png)  
> 3.3 Check the “Visitors” group, and in the ribbon, click the **Edit Permissions** button  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/42efd3f9981c366a21362de35eff5280bea03ad3.png)  
> 3.4 Tick off “ **Contribute** ” permissions, and click **OK**.  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/2f5c3f4f15d2c22750991e6eadf4131082e408e0.png)

> **Colors and filters**
>
> **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:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/763898f5916d170fff97ea7644e0c8279b6592df.png)  
> From here, you can define the list of available categories:  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/d1a5c05c66ddab95b9942b659f41cec95bcfbcfa.png)
> 
> So how do you map colors to those categories?
> 
> Simply go wo Origami Calendar web part properties and click this button:  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/aa96f40c7077d4d5a1e483065dfb98535f38952f.png)
> 
> From here you can map each category to any desired color:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/c/c55b5e3dc85f8d173ef81dc5da95f3f86d2749d7.png)
> 
> Save the web part properties and the page to see changes.
> 
> * * *
> 
> **Category filter**
> 
> If you have a lot of events for a particular range, you can let users to filter events by category, like this:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/e/e0334ae86c203d1626282c22828f6364e8f6e31f.png)
> 
> To set this up, simply go to web part properties under **Change Colors & Styles** and set the **Show category filter** toggle to **On** like this:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/7/7e03493be2015ff4f9a331c6ca4a2cbded9fef51.png)

> **Changing calendar styles**
>
> In addition to color coding your events, you can also change the date picker colors using these web part properties, web part height and other options as shown below:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/1X/99e4e64a83778c0684e80c8e2ade3f9b07612fd1.png)
> 
> * * *
> 
> **Save Styles as Template**  
> _Available in Calendar – Version April 26, 2025_
> 
> You can fully customize the **Calendar** web part — apply your corporate fonts, colors, and styles — and **save those settings as a template** with just one click.
> 
> Go to web part properties under the **Save Settings** section, and click **Save Current Settings as Template**.
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/e/e288b41ab72c2ff665b0de8a4b6dffed868ee156.png)
> 
> From now on, any new Calendar web part will automatically use your saved style settings as the default.
> 
> You can always tweak styles if needed–applying a template will not restrict your options, you simply have a better starting point.

> **Targeting events to an audience in SharePoint**
>
> You can make it so events show only to members of specific M365 groups.  
> When creating an event in SharePoint, set the group in the **Audience** field:
> 
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/0/09ad7af3273bb3213f5e517c2ab96556af384c17.png)
> 
> The calendar will show this event only to users who belong to this M365 group.
> 
> Don’t see the **Audience** field? You need to enable it in SharePoint first:
> 
> 1. Go to **Site contents** on the site where your event list is located
> 2. Open the events list that you’re reading from
> 3. Go to Events list **Settings**
> 4. Click on **Audience targeting**  
> ![image](https://canada1.discourse-cdn.com/flex031/uploads/origamiconnect/original/2X/9/91ec9ba1cc4cc2e7390b79315a543b8b177e20c4.png)
> 5. Check **Enable audience targeting**
> 6. Click **OK**
> 
> You will now see the **Audience** in your item details.

–

> **Known issues**
>
> Removing **View Application Pages** permission level on a list used by Origami Calendar will cause that calendar events to not load
> 
> > **More details**
> >
> > ### Summary
> > 
> > Origami Calendar relies on **supported SharePoint APIs and navigation patterns** to retrieve and display events from one or more SharePoint calendars.  
> > When a custom SharePoint permission level **removes the “View Application Pages” permission** , certain Origami Calendar features will no longer function as expected.
> > 
> > This behavior is **by design in SharePoint** and cannot be mitigated or overridden by third-party solutions, including Origami.
> > 
> > * * *
> > 
> > ### What is “View Application Pages” permission
> > 
> > The **View Application Pages** permission controls access to SharePoint **application pages** , including pages hosted under:
> > 
> > ```auto
> > /_layouts/15/
> > 
> > ```
> > 
> > These pages are used by SharePoint for:
> > 
> > - system forms and dialogs
> > - list and view enumeration
> > - event and item display pages
> > - internal navigation and metadata resolution
> > 
> > This permission is **foundational to SharePoint’s UI and API model**.
> > 
> > * * *
> > 
> > ### Impact on Origami Calendar
> > 
> > When **View Application Pages is removed** , the following Origami Calendar capabilities are affected:
> > 
> > ### 1. Event detail navigation (direct impact)
> > 
> > Origami Calendar opens SharePoint’s event details page when a user clicks an event title:
> > 
> > ```auto
> > /_layouts/15/Event.aspx?ItemId=...&ListGuid=...
> > 
> > ```
> > 
> > This page is an **application page**.
> > 
> > **Result when permission is removed**
> > 
> > - Event titles open to **Access Denied** or fail to load
> > - This occurs even though the event itself exists and may be visible in list queries
> > 
> > * * *
> > 
> > ### 2. Calendar and list enumeration (direct impact)
> > 
> > Origami Calendar supports:
> > 
> > - aggregating events from **multiple calendars**
> > - pulling events from **different sites**
> > - reading **specific list views**
> > 
> > To do this, the web part must:
> > 
> > - enumerate lists
> > - read list metadata
> > - resolve views and CAML queries
> > 
> > These operations rely on SharePoint endpoints that **require View Application Pages**.
> > 
> > **Result when permission is removed**
> > 
> > - Calendars or views may not be discovered
> > - Some configured calendar sources may silently return no data
> > - Multi-calendar aggregation becomes unreliable or incomplete
> > 
> > * * *
> > 
> > ### 3. Differences vs native SharePoint behavior (important clarification)
> > 
> > Customers may observe that the **native SharePoint Events web part continues to display events** under the same permission model.
> > 
> > This difference is expected and does **not** indicate an issue with Origami.
> > 
> > Native SharePoint web parts:
> > 
> > - run entirely within SharePoint’s internal page context
> > - rely on **privileged, undocumented, internal APIs**
> > - are not constrained by the SharePoint Framework (SPFx) permission boundaries applied to third-party solutions
> > 
> > Origami Calendar:
> > 
> > - is a **third-party SPFx solution**
> > - uses **only supported SharePoint APIs**
> > - fully respects SharePoint’s permission enforcement
> > 
> > As a result, **native behavior cannot be used as a baseline or expectation** for third-party web parts under restrictive custom permissions.
> > 
> > * * *
> > 
> > ## Supported vs Unsupported Configurations
> > 
> > ### Supported
> > 
> > - Standard SharePoint permission levels
> > - Custom permission levels that **retain View Application Pages**
> > - Scenarios where users can access application pages required by SharePoint UI and APIs
> > 
> > ### Not supported
> > 
> > - Custom permission levels that **remove View Application Pages**
> > - Configurations that expect third-party web parts to:
> > - bypass SharePoint permission enforcement
> > - replicate native SharePoint internal behavior
> > - access restricted application pages
> > 
> > * * *
> > 
> > ## Official Origami Support Position
> > 
> > > Origami does not support configurations where **View Application Pages** is removed from user permission levels.
> > 
> > We will **not modify Origami code** to:
> > 
> > - work around SharePoint permission enforcement
> > - bypass restricted application pages
> > - replicate undocumented native SharePoint behavior
> > 
> > These limitations are imposed by SharePoint itself and apply to **all third-party SPFx solutions** , not just Origami.
> > 
> > * * *
> > 
> > ## Recommendations
> > 
> > If your project requires:
> > 
> > - aggregated calendars
> > - multiple event sources
> > - view-based event filtering
> > - reliable event navigation
> > 
> > Then **View Application Pages must remain enabled** in the applicable permission levels.
> > 
> > If strict permission control is required, we recommend:
> > 
> > - limiting **Edit** , **Delete** , or **Manage Lists**
> > - avoiding removal of foundational SharePoint permissions
> > 
> > * * *
> > 
> > ## Related Symptoms
> > 
> > Customers affected by this configuration may observe:
> > 
> > - event titles opening to _Access Denied_
> > - missing events from some calendars
> > - inconsistent behavior across sites or views
> > - differences compared to native SharePoint web parts
> > 
> > * * *
> > 
> > ## Conclusion
> > 
> > Removing **View Application Pages** fundamentally alters how SharePoint APIs behave.  
> > While native SharePoint may continue to function in limited scenarios, **third-party solutions cannot**.
> > 
> > This is a SharePoint platform constraint, not a defect in Origami.