How to Apply Custom JavaScript/CSS on a Modern SharePoint Site

NOTEIf you're looking for more ways to add JavaScript/CSS into your SharePoint page, you can check out our FREE ShortPoint Code Editor Web Part. For more information on how to use it, go to How to Insert JavaScript Code into SharePoint Using the ShortPoint Code Editor Web Part.

If you have some JavaScript/Custom CSS that you need to apply for your Microsoft 365 site, you can easily do this using the Custom JavaScript/Custom CSS feature in the Theme Builder tool by following these steps.

Step 1: Open the Theme Builder

Go to the Site Settings

Then to ShortPoint Dashboard

Click the Theme Builder option:

Select Customize my site button

Step 2: Apply your Custom JavaScript/Custom CSS

Once the branding & customization tool is opened, Navigate into Utilities

Then to Custom JavaScript or Custom CSS: 

Paste your code into the Custom JavaScript/ Custom CSS Field, and click Apply button: 

Custom JavaScript:

Custom CSS:

Don't forget to Publish your changes, so they will be applied on your SharePoint site.

Related articles:

Apply Custom CSS from ShortPoint Theme Builder