Reference jQuery in SharePoint 2013/2010 master page or in Application Page
Check out Best Alternative to InfoPath -> Try Now
This SharePoint tutorial explains how to give reference of jQuery file in SharePoint 2013/2010 master page. Lots of time you may require to refer jQuery file references in SharePoint 2010/2013 page. In this case, we can add the jQuery file reference inside the master page in SharePoint 2010/2013.
Also, we will discuss how we can give JQuery reference in Application pages in SharePoint 2010/2013.
Reference jQuery in SharePoint 2013/2010 master page
To call jQuery through the master page, we should have permission to edit master pages. This is one of the simplest and direct approaches. But we have to update in each master page we want to include jQuery.
Follow below steps:
Open the master page using SharePoint designer 2010 (for SharePoint 2010 sites and for SharePoint 2013 site, open with SharePoint designer 2013) which you want to add, in the head section add the script below:
Apart from using ScriptLink we can also directly call using Script tag like below:
In the ScriptLink tag the name attribute is the is a relative path to jQuery in the Layouts folder.
JQuery reference in Application pages in SharePoint
To give script reference is application page is similar to giving reference in master page technique.
There are different placeholders present in the master page and when you create an application page, you have the ability to add content into the content placeholders that the master page exposes.
Here we will see how we can add content to PlaceHolderAdditionalPageHead placeholder present in the master page.
Write the below code in the application page:
<asp:Content ID=”PageHead” ContentPlaceHolderID= “PlaceHolderAdditionalPageHead” runat=”server”>
The jQuery will be available to the application page.
You may like following SharePoint master page tutorials:
- SharePoint 2010 create new custom master page using SharePoint designer 2010
- Change master page programmatically SharePoint 2010
- Fix width of master page in SharePoint 2010
- Create a custom master page using Design Manager in SharePoint Online/2013/2016
- Convert an HTML page into SharePoint master page using Design manager in SharePoint serve 2013
- SharePoint Online Step by Step Tutorial on how to create a new custom master page by using an existing master page
- How to change Master Page in SharePoint 2016, SharePoint 2013 or SharePoint Online?
The advantages of using ScriptLink method is you can asynchronously run as well as an option to defer loading until the page is ready.
Hope this SharePoint tutorial helps to give jQuery reference in SharePoint 2010/2013 master page and in application pages in SharePoint.
SharePoint Online FREE Training
JOIN a FREE SharePoint Video Course (3 Part Video Series)