Search This Blog

Thursday, March 19, 2015

Programmatically adding JQuery, custom JS and CSS file reference to your master page without modifying the master page

I found very interesting component of SharePoint -AdditionalPageHead Content Place Holder in master page which can be used for adding JavaScript, Meta Tags, CSS Styles or other content to the page without modifying them.


One practical scenario would be programmatically adding JQuery, custom JS and CSS file reference to your master page without modifying the master page it.

You need to create a Delegate Control and deploy it using a feature. Below is the snapshot for Feature.XMLfile.
<?xml version="1.0" encoding="utf-8"?>
  <Control Id="AdditionalPageHead"
           ControlSrc="~/_controltemplates/MyFolder/MyCustomPageHead.ascx"
           Sequence="1499"/>
</Elements>

Change the sequence number and control path and name as per your requirement. 

In the MyCustomPageHead.ascx add the references of JS/CSS

<script type="text/javascript" src="/_layouts/../JS/jquery-1.7.1.min.js"></script>
….
….
<link rel="stylesheet" type="text/css" href="/_layouts/../../../jquery-ui-1.8.18.custom.css" />
<script type="text/javascript">
</script>


Just deploy your feature and activate it in the site where you want to add JS and CSS references.

No comments:

Post a Comment