1. SPSVB 2015 Create Tailored Search Results w/ Display Templates SHAREPOINT SATURDAY VIRGINIA BEACH– JANUARY 10, 2015 MIKE ORYSZAK BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK

2. About Me  Senior SharePoint Solution Architect w/ B&R Solutions  Microsoft SharePoint Server MVP (2010-2014 * 5 time)  Leader for Triangle SharePoint User Group (TriSPUG)  Dev and Architect with MS stack since 1996  Working with SharePoint since 2002  Raleigh-Durham, NC BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 2

3. SPSVB 2015 K2

4. Session Overview  Display Template Basics  How to Work With Display Templates  Examples:  Example 1 – Simple tweak of standard results  Example 2 – Show results in a grid view  Example 3 – Working with People Results  Example 4 – Customize the hover panel  Closeout Target Audience: Developers interested in creating customized result displays or building search driving applications. BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 4

5. Display Template Basics CREATE TAILORED SEARCH RESULTS W/ DISPLAY TEMPLATES BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 5

6. SPSVB 2015 Display Template Basics  What are Display Templates?  Display templates are used by the Search related Web Parts to render search results in SharePoint 2013  They leverage client side code to allow for dynamic injection and rendering  Important to note: Part of the Design Manager layer BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 6

7. SPSVB 2015 Display Template Basics  Located in the Master Page Gallery at the Site Collection level  Under Display Templates/Search  Considerations  Can map a drive to the gallery or upload the files individually  Pair of files for each template; html and javascript  You work with html, the javascript file is generated when the html file is saved to the gallery  Display Template Reference:  http://technet.microsoft.com/en-us/library/jj944947(v=office.15).aspx http://technet.microsoft.com/en-us/library/jj944947(v=office.15).aspx BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 7

8. SPSVB 2015 Display Template Basics  Process Flow with Result Type Rules  Dynamically selects which template to use on each item based on the rules BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 8

9. SPSVB 2015 Display Template Basics  Process Flow with Result Type Rules  Central Control File  Specified item template shows all items formatted the same way BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 9

10. Examples CREATE TAILORED SEARCH RESULTS W/ DISPLAY TEMPLATES BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 10

11. SPSVB 2015 Tweak Standard Results  Simple example to get us started, minor format changes to existing display BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 11

12. SPSVB 2015 Grid View Results  Modify the results to show them in a grid/table view BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 12

13. SPSVB 2015 Working With People Results  Working with People results and presence BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 13

14. SPSVB 2015 Customizing the Hover Panel  Provide layout changes to the hover panel BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 14

15. Showing Dynamic Content Demonstration BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 15

16. Closeout CREATE TAILORED SEARCH RESULTS W/ DISPLAY TEMPLATES BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 16

17. Questions? BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 17

18. SPSVB 2015 Resources  Design Manager display templates  http://msdn.microsoft.com/en-us/library/office/jj945138(v=office.15).aspx http://msdn.microsoft.com/en-us/library/office/jj945138(v=office.15).aspx  Display Template Reference  http://technet.microsoft.com/en-us/library/jj944947(v=office.15).aspx http://technet.microsoft.com/en-us/library/jj944947(v=office.15).aspx  Add Presence to SharePoint Search Results – Matthew McDermott  http://www.ableblue.com/blog/archive/2013/06/05/add-presence-to-sharepoint-search-results/ http://www.ableblue.com/blog/archive/2013/06/05/add-presence-to-sharepoint-search-results/  Search Results in Grid View  http://mikeoryszak.com/2014/05/search-results-in-grid-view/ http://mikeoryszak.com/2014/05/search-results-in-grid-view/  My Search Blog Posts  http://mikeoryszak.com/tag/search/ http://mikeoryszak.com/tag/search/  SP Search Queries Explained – The Book  http://techmikael.blogspot.com/2015/01/sharepoint-search-queries-explainedthe.html http://techmikael.blogspot.com/2015/01/sharepoint-search-queries-explainedthe.html BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 18