Unlocking Efficiency: Streamlining Custom Functionality for Site Owners with SharePoint Online Site Templates
Tags: sharepoint, workplace, intranet
Published: 2023-06-20 13:49:24

Over the past few days, I have been conducting research on the functionalities surrounding **_Site Templates_**, and I have been amazed by the **extensive possibilities** they offer. These templates provide remarkable **benefits** to both the users who apply them and the developers who create them. The users can leverage the convenience and consistency of **preconfigured site structures**, saving time and effort in setting up new sites. Meanwhile, developers can design and customize these templates to meet specific organizational requirements, enabling **efficient** site provisioning and empowering users with **powerful** out-of-the-box functionalities. The versatility and potential of **_Site Templates_** truly impressed me, opening up a world of possibilities for seamless SharePoint site deployment and management.

![*An example of the Microsoft 365 site templates options*](https://substackcdn.com/image/fetch/f_auto,q_auto:good,fl_progressive:steep/https%3A%2F%2Fsubstack-post-media.s3.amazonaws.com%2Fpublic%2Fimages%2Ffee749e1-9ca8-49f5-aada-b414840bfffc_2718x1707.png)

The benefits we gain from using **_Site Templates_** include:
- **_Functionality Catalog_**: A comprehensive repository of preconfigured features and components that can be easily applied to new sites, enhancing productivity and user experience.
- **_Functionality Governance Model_**: A structured approach to managing and controlling the deployment and usage of functionalities across sites, ensuring consistency, compliance, and efficient maintenance.
- **_Usage Metrics and Analytics_**: Tracking and analyzing the utilization of functionalities within sites, providing valuable insights for optimization, decision-making, and enhancing user engagement.
- **_Standardized Development Model_**: A consistent framework for designing and developing functionalities, enabling efficient collaboration, code reuse, and streamlined maintenance across different projects and teams.

And to illustrate my point, in this article, I want to showcase three example functionalities that can be addressed using "Site Templates":
- **_Analytics_**: Explore how to integrate tools like Azure Application Insights, Google Analytics, or other web metrics software to gather valuable insights on site usage and performance.
- **_Corporate Branding_**: Provide a simple and convenient method to configure and apply corporate colors, logos, and settings to ensure consistent branding across all sites, reinforcing the company's identity and visual representation.
- **_Document Management_**: Create a standardized foundation for efficient document organization, version control, and collaboration across different solutions within the organization.

![*The list of the custom site templates available for the users*](https://substackcdn.com/image/fetch/w_1456,c_limit,f_webp,q_auto:good,fl_progressive:steep/https%3A%2F%2Fsubstack-post-media.s3.amazonaws.com%2Fpublic%2Fimages%2F1c7d99e1-274b-4c5c-8952-2518286109a3_2718x1428.png)

## Analytics

Envision offering our colleagues a solution that empowers them with **advanced analytics capabilities** on any **SharePoint Online** site. Our goal is to make this solution **easily activatable** by site owners without requiring IT intervention.

While the default metrics provided by the tool are valuable, we acknowledge the need for additional information. This can be achieved by incorporating a third-party tool through JavaScript code. Consider leveraging **Azure Application Insights** or a similar tool like Google Analytics.

To implement this solution, we will utilize **SharePoint Framework (SPFx)** to add the necessary JavaScript code as an Extension on each page within our site collection. By deploying the SPFx package to the tenant, it becomes readily available for integration into any SharePoint Online site collection.

Now, the crucial question arises: **How can we simplify the process of applying this solution for other SharePoint Online site owners?**

The answer lies in the utilization of **_Site Templates_** and **_Site Scripts_**. By harnessing these powerful capabilities, we can empower our users with a pre-configured site template. **Applying this template automates the deployment process and seamlessly incorporates the Extension into the site**.

Through this approach, our colleagues can **effortlessly activate** advanced analytics on their SharePoint Online sites, **without relying on IT support**. This not only streamlines the activation process but also amplifies the analytics capabilities accessible to site owners.

Here you have the example of a possible **_Site Script_** and, consequently, for a **_Site Template_**:

```
{
  "$schema": "schema.json",
  "actions": [
	  {
	      "verb": "installSolution",
	      "id": "<<SPFx package identifier>>"
	  },
	  {
	      "verb": "associateExtension",
	      "title": "<<Extension title in the App Catalog>>",
	      "location": "ClientSideExtension.ApplicationCustomizer",
	      "clientSideComponentId": "<<Extension identifier in the App Catalog>>",
	      "scope": "Site"
	  }
  ]
}
```

## Corporate branding

In companies and organizations, it is common to implement intranets, team sites, or other spaces where configuring **corporate colors and adding the company logo** becomes essential. Our objective is to provide an **easy way to customize SharePoint Online** sites with the corporate brand. Additionally, we aim to **unify criteria** by establishing regional settings, including time zone, language, and more.

In addition to this, we include IT personnel in the "Owners" security group to ensure the consistency in account responsibilities beyond the site's intended purpose.

![*An example of how a site theme is applied to a SharePoint Online site collection*](https://substackcdn.com/image/fetch/w_1456,c_limit,f_webp,q_auto:good,fl_progressive:steep/https%3A%2F%2Fsubstack-post-media.s3.amazonaws.com%2Fpublic%2Fimages%2F09c6e84c-6e5b-45a9-a2db-d652b55c2d24_2718x1944.png)

These tasks can be performed manually or automated using PowerShell scripts or o365 CLI. However, our focus is to minimize IT involvement. Therefore, we offer functionalities that site owners can apply independently.

In this case, we have developed four **_Site scripts_** with specific objectives. Firstly, one script sets the **company logo**. Secondly, another script configures the **color theme**. Thirdly, a script handles **regional settings** such as time zone and language. Lastly, a script adds the appropriate owners to the site.

This separation allows these scripts to be utilized in other **_Site Templates_**, continually enhancing the template ecosystem. Let me share the corresponding one to the theme:

```
{
    "$schema": "schema.json",
    "actions": [
        {
            "verb": "applyTheme",
            "themeJson": {
                "name": "Intranet from the trenches",
                "isInverted": false,
                "backgroundImageUri": "",
                "palette": {
                    "themePrimary": "#66CD7A",
                    "themeLighterAlt": "#f8fdf9",
                    "themeLighter": "#e3f7e7",
                    "themeLight": "#ccf0d3",
                    "themeTertiary": "#9de0ab",
                    "themeSecondary": "#76d288",
                    "themeDarkAlt": "#5cb86e",
                    "themeDark": "#4e9b5d",
                    "themeDarker": "#397245",
                    "neutralLighterAlt": "#f8f8f8",
                    "neutralLighter": "#f4f4f4",
                    "neutralLight": "#eaeaea",
                    "neutralQuaternaryAlt": "#dadada",
                    "neutralQuaternary": "#d0d0d0",
                    "neutralTertiaryAlt": "#c8c8c8",
                    "neutralTertiary": "#b5d5bc",
                    "neutralSecondary": "#78ab83",
                    "neutralSecondaryAlt": "#78ab83",
                    "neutralPrimaryAlt": "#4a8456",
                    "neutralPrimary": "#397245",
                    "neutralDark": "#2c5735",
                    "black": "#204027",
                    "white": "#ffffff"
                }
            }
        }
    ]
}
```

## Document management

In this scenario, our objective is to **supply** the essential **set of document libraries** for effective content management across all company sites. Moreover, we will create libraries for contracts, security policies, procedures, and product specifications.

Additionally, procedures will include an **extra column** for easy classification by typology. Furthermore, specifications will be organized into **three folders** based on their publication status: drafts, undergoing reviews, and public documents.

While manual creation is viable for a small number of instances, say in 1 or 2 site collections, PowerShell scripts or o365 CLI can also be employed for a bigger number.

![*An example of how some libraries and their corresponding links at the top navigation menu are created*](https://substackcdn.com/image/fetch/w_1456,c_limit,f_webp,q_auto:good,fl_progressive:steep/https%3A%2F%2Fsubstack-post-media.s3.amazonaws.com%2Fpublic%2Fimages%2F265fc4f4-63b4-401c-90c9-ec8824745974_2718x1944.png)

However, our ultimate aim is to **enable site owners** to utilize this mechanism independently without IT intervention. Hence, through the utilization of **_Site Scripts_** and **_Site Templates_**, we can deliver the necessary functionality to fulfill these requirements. Below is a possible implementation example.

```
{
    "$schema": "schema.json",
    "actions": [
        {
            "verb": "createSPList",
            "listName": "Contracts",
            "templateType": 101,
            "addNavLink": true,
            "color": "yellow",
            "subactions": [
                {
                    "verb": "setDescription",
                    "description": "Library for final contracts only"
                }
            ]
        },
        {
            "verb": "createSPList",
            "listName": "Security Policies",
            "templateType": 101,
            "addNavLink": true,
            "color": "orange",
            "subactions": [
                {
                    "verb": "setDescription",
                    "description": "Library for security policies"
                }
            ]
        },
        {
            "verb": "createSPList",
            "listName": "Procedures",
            "templateType": 101,
            "addNavLink": true,
            "color": "green",
            "subactions": [
                {
                    "verb": "setDescription",
                    "description": "Standard procedures for general processes"
                },
                {
                    "verb": "addSPField",
                    "fieldType": "Text",
                    "displayName": "Type",
                    "isRequired": true,
                    "addToDefaultView": true
                }
            ]
        },
        {
            "verb": "createSPList",
            "listName": "Specifications",
            "templateType": 101,
            "addNavLink": true,
            "color": "blue",
            "subactions": [
                {
                    "verb": "addFolder",
                    "path": "Draft"
                },
                {
                    "verb": "addFolder",
                    "path": "Review"
                },
                {
                    "verb": "addFolder",
                    "path": "Published"
                }
            ]
        }
    ]
}
```

## Conclusion

As you have witnessed, **leveraging** **_Site Templates_** **enables** the provision of a **comprehensive** set of **functionalities** to **employees**, who can **effortlessly utilize them**. Moreover, the combination of **_Site Templates_** and **_Site Scripts_** offers an extensive array of instructions for creating and configuring elements in SharePoint Online.

What are you waiting for? **Start utilizing** or proposing this solution **in your company** and unlock the benefits of streamlined site creation, **enhanced user experience**, and **simplified management**. Empower your employees with ready-to-use templates and unleash the **full potential of SharePoint Online**. Don't miss out on the opportunity to optimize productivity and collaboration within your organization.

## References
 
Here are some useful links I've utilized for crafting the article:
* *Build your first SharePoint Framework Extension (Hello World part 1): https://learn.microsoft.com/en-us/sharepoint/dev/spfx/extensions/get-started/build-a-hello-world-extension*
* *Deploying Application Customizers with a Site Design: https://spdcp.com/2019/10/24/deploying-application-customizers-with-a-site-design/*
* *The Ultimate Guide to SharePoint Site Templates and Site Scripts: https://laurakokkarinen.com/the-ultimate-guide-to-sharepoint-site-designs-and-site-scripts/*
* *Site Script schema: https://developer.microsoft.com/json-schemas/sp/site-design-script-actions.schema.json*
* *Thanks to [Hector Sosa](https://dev.to/ekqt), the author of usescreenshot.app application, for allowing framing pictures: [https://usescreenshot.app/](https://usescreenshot.app/)*


> *Don't forget to share the article with your friends and colleagues if you find it interesting, click on the heart if you like it, or click on the comments to share what you think of the article, if you would add more or if you want to clarify any of them.*