How to Add JavaScript Code to a Page Using the Script Editor Web Part (SharePoint 2013/2016)

You have an HTML, JavaScript or CSS snippet that you want to inject into the page, without having it cleared out by the SharePoint editor? This article will show you how to do it using the Script Editor Web Part.

TABLE OF CONTENTS

• Before we begin
• Step 1: Add the Script Editor Web Part
• Step 2: Edit the Web Part
• Step 3: Add the Code into the Web Part

Before we begin

Please note: This method is only applicable to Classic pages in SharePoint 2013 and SharePoint 2016 environments. If you are using SharePoint 2019 or Office 365, please use the Code Design Element instead.

Step 1: Add the Script Editor Web Part

From ribbon bar, click Web Part (you can add it anywhere on the page, it does not matter, as it will not render anything):

Under Categories, choose Media and Content > Script Editor and click Add:

Step 2: Edit the Web Part

Activate the Web Part by clicking it, then a new tab Web Part in the ribbon will appear:

Then next, click the Web Part Properties button:

Step 3: Add the Code into the Web Part

The page will refresh, and the Script Editor Web Part will appear now in edit mode, click on Edit Snippet, to bring up the dialog that will allow you to paste some JavaScript code into the page.

Now you can paste whatever HTML code you have into the Embed dialog:

Please note, that script tags are required when adding custom JavaScript to your Sharepoint Site:

Related articles:

• Execute JavaScript After ShortPoint Elements Render Event
• Introducing ShortPoint Code Design Element