SharePoint Responsive UI Package for on-premises (SP 2013 and SP 2016)

Download this episode

Download Video


In this demo video Paolo Pialorsi explains how to get started on using SharePoint Responsive UI Package in your on-premises deployment. SharePoint Responsive UI Package is designed for both SharePoint 2013 and SharePoint 2016 in on-premises deployment. 

Actual implementation is NOT using custom master pages, we rather embed the needed styling definitions and JavaScript files to the site using so called JavaScript embed pattern, which is explained in MSDN. This means that the responsiveness can be applied even if the sites are still using out-of-the-box master pages.

SharePoint Responsive UI Package is open source solution, released from the PnP initiative to enable responsiveness user experience in your on-premises deployment. Similar capability and assets have been released to SharePoint Online as part of the PnP Partner Pack.

Demo presenter: Paolo Pialorsi

Additional Resources

See following links for additional details around covered topics.

If you are looking to enable similar capabilities in the SharePoint Online, please have a look on the PnP Partner Pack and more specifically following resources


If you have any feedback or comments related on this video, please use the Office 365 Developer Patterns and Practices Yammer group to provider your input. Thx for your interest advance.

Generic Episode Image





Available formats for this video:

Actual format may change based on video formats available and browser capability.

    The Discussion

    • User profile image

      Wonderful Implementation. Best example & benefits of Open Source Development.

    • User profile image
      Bastiaan Jacobs

      Very good start. I am curious how this will turn out for companies that want to change their style completely on SharePoint. Wrapping elements in the Master Page is sometimes necessary for Responsive Web Design to align elements on the page (s4-titlerow - s4-workspace). Last but not least: When using media queries please use min-width: mobile first people. Minimize different conditions for mobile devices.

    Comments closed

    Comments have been closed since this content was published more than 30 days ago, but if you'd like to send us feedback you can Contact Us.