The Core.EmbedJavaScript.HeaderFooter sample provides a provision page to include a custom Header and Footer. The Header and Footer sample includes custom Global Breadcrumbs (SharePoint or JSON Data) and custom Global Ribbons that are acessible in all sites and subsites associated to Site Collection. The Custom Breadcrumb is able to Navigate betweeen all Site Collection Sites and sub folders where user is located, the Site Collection Navigation is an custom Breadcrumb stored in PropertyBag base in JSON Data. The Breadcrumb & Ribbon is available in all SharePoint Pages using an Scriptlink file stored in Site Collection, both features keep Minimal Download Strategy "MDS" enable.
- Office 365 Multi Tenant (MT)
- Office 365 Dedicated (D)
- SharePoint 2013 on-premises
None
Solution | Author(s) |
---|---|
Core.EmbedJavaScript.HeaderFooter | André Lage |
Version | Date | Comments |
---|---|---|
1.0 | Jun 18th 2015 | Initial release |
THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.
The Solution is an SharePoint Add-In that can be deployed in the app catalog site of the Tenant and then installed in the SharePoint Site using "Add an app" Option.
The Add-in provides a Page to support the different steps of the provisioning of Header and Footer and associated features such us Global Breadcrumbs (SharePoint or JSON Data) and Custom Global Ribbon acessible in all Sites and Folders in the Site Collection.
The Page has 1 JSON Editor and 2 buttons for provision of Features associated to Header and Footer.
- JSON Editor Area, this feature allow to customize the JSON data to create and Custom Breadcumb acessible in the HostWeb Site.
- The Add provision option includes the Objects "PropertyBag/JSON/JSFile/ScripLink" in the RootHostWeb.
- The Remove provision option removes the Objects "PropertyBag/JSON/JSFile/ScripLink" from the RootHostWeb.
- PropertyBag PnPGlobalBreadcrumbRibbon is created in RootWeb of the SiteCollection, this item will have the JSON data from the JSON Editor Area, if the JSON is not correct format then assumes the default JSON Data: {"Breadcrumb": [{"title": "Home","description": "Home","url":"https://github.com/OfficeDev"},{"title": "Product Category","description": "Product Category","url":"https://github.com/OfficeDev"},{"title": "Product","description": "Product","url":"https://github.com/OfficeDev"},{"title": "Example","description": "Example","url":"https://github.com/OfficeDev"}]}
- A file from the AppWeb PnPGlobal.js is copied to folder "_catalogs/masterpage/Display Template", the JS file includes the code for the creation of the Global Breadcrumb (SharePoint or JSON Data) & Ribbon.
- A ScriptLink is created in SiteCollection with name PnPGlobalBreadcrumbRibbon and linked to JS file PnPGlobal.js.
- Custom Header with Following Features:
- Global BreadCrumb (SharePoint or JSON Data) is included bellow the Ribbon Banner.
- Global Ribbon with custom Actions is included in Ribbon Banner ().
- Custom Footer with Following Feature:
- Global BreadCrumb by SharePoint Data (Path where user is located)
- Breadcumb is generated by SharePoint Data or JSON stored in "RootWeb" propertybag "PnPGlobalBreadcrumbRibbon"
- Minimal Download Strategy (MDS) is enable without issues.
- Breadcumb & Ribbon are available in all Sub Sites of the Site Collection.
- Ribbons Custom Actions can be included in the Global Ribbon.
SP Ribbon Objects https://paulbuzzblog.wordpress.com/2012/11/23/how-to-hide-the-sharepoint-ribbon/
Provision Files AppWeb to HostWeb http://www.sharepointnutsandbolts.com/2013/05/sp2013-host-web-apps-provisioning-files.html