SharePoint Saturday Belgium 2014 The SharePoint 2013 Design Manager: From HTML to SharePoint
Download as PPTX, PDF•1 like•654 views
The document discusses the SharePoint 2013 Design Manager tool for customizing branding and design across SharePoint publishing sites. It provides an overview of approaches to branding SharePoint, describes the SharePoint page model and how Design Manager fits in. It also demonstrates how to use Design Manager to create HTML snippets and design packages that can be applied across sites for consistent branding.
![Item Page Layout
<div>
<!--CS: [HolidayPriceOW SNMBR] Start Catalog-Item Reuse Snippet-->
<!--SPM:<cc1:CatalogItemReuseWebPart runat="server" UseServerSideRenderFormat="True" ResultType="" NumberOfItems="1"
UseSharedDataProvider="True" OverwriteResultPath="False" ResultsPerPage="1"
SelectedPropertiesJson="["HolidayPriceOWSNMBR"]"
Title="$Resources:Microsoft.Office.Server.Search,CBSItem_Title;"
Description="$Resources:Microsoft.Office.Server.Search,CBSItem_Description;"
MissingAssembly="Cannot import this Web Part." ID="g_c5a7f657_adfe_4246_86d0_821f1cdf714c"
__WebPartId="{c5a7f657-adfe-4246-86d0-821f1cdf714c}">-->
<!--SPM:<RenderFormat>-->
<!--SPM:<Format Type="Number"> -->
<!--SPM:<DecimalPlaces>-->
2
<!--SPM:</DecimalPlaces>-->
<!--SPM:<Currency>-->
False
<!--SPM:</Currency>-->
<!--SPM:</Format> -->
<!--SPM:</RenderFormat>-->
<!--SPM:</cc1:CatalogItemReuseWebPart>-->
<!--CE:End Catalog-Item Reuse Snippet-->
</div>](https://image.slidesharecdn.com/spsbe14lievensps33-140504021930-phpapp01/85/SharePoint-Saturday-Belgium-2014-The-SharePoint-2013-Design-Manager-From-HTML-to-SharePoint-24-320.jpg)
SharePoint Saturday Belgium 2014 The SharePoint 2013 Design Manager: From HTML to SharePoint
- 1. The SharePoint 2013 Design Manager: From HTML to SharePoint #SPSBE33 Lieven Iliano, U2U April 26th, 2014
- 2. Agenda
- 3. Thanks to our sponsors! Gold Silver
- 4. Branding on the web
- 5. Approaches to Branding SharePoint 2013 Full Effort Custom Master Pages, Page Layouts, Display Templates Medium Effort Design Manager for Publishing Sites Custom CSS & Background Images Low Effort Page Editing & Composed Looks
- 6. SharePoint Page Model: Master Page PlaceHolderMain
- 7. SharePoint Page Model: Wiki Pages Master Page Wiki Page
- 8. SharePoint Page Model: Publishing Pages Page Layout Master Page Publishing Page
- 10. Design Manager
- 12. Using the Design Manager
- 14. Snippet Gallery
- 16. HTML Snippet markup <!--SPM:<%@Register Tagprefix="SharePoint" Namespace="Microsoft.Share..." <!--CS: Start Top Navigation Snippet--> … <!--CE: End Top Navigation Snippet--> <!--MS:<asp:SiteMapDataSource ShowStartingNode="True" >--> <!--ME:</asp:SiteMapDataSource>--> <!--PS: Start of READ-ONLY PREVIEW (do not modify)--> preview sections are a snapshot in time of the SharePoint control that snippet is inserting. !--PE: End of READ-ONLY PREVIEW-->
- 21. Content Search Web Part
- 24. Item Page Layout <div> <!--CS: [HolidayPriceOW SNMBR] Start Catalog-Item Reuse Snippet--> <!--SPM:<cc1:CatalogItemReuseWebPart runat="server" UseServerSideRenderFormat="True" ResultType="" NumberOfItems="1" UseSharedDataProvider="True" OverwriteResultPath="False" ResultsPerPage="1" SelectedPropertiesJson="["HolidayPriceOWSNMBR"]" Title="$Resources:Microsoft.Office.Server.Search,CBSItem_Title;" Description="$Resources:Microsoft.Office.Server.Search,CBSItem_Description;" MissingAssembly="Cannot import this Web Part." ID="g_c5a7f657_adfe_4246_86d0_821f1cdf714c" __WebPartId="{c5a7f657-adfe-4246-86d0-821f1cdf714c}">--> <!--SPM:<RenderFormat>--> <!--SPM:<Format Type="Number"> --> <!--SPM:<DecimalPlaces>--> 2 <!--SPM:</DecimalPlaces>--> <!--SPM:<Currency>--> False <!--SPM:</Currency>--> <!--SPM:</Format> --> <!--SPM:</RenderFormat>--> <!--SPM:</cc1:CatalogItemReuseWebPart>--> <!--CE:End Catalog-Item Reuse Snippet--> </div>
- 27. Device Channels
- 28. Device Channels
- 30. Design Packages
- 31. Design Packages
- 33. Thank you!