1. SPSATL 2014 Create Tailored Search Results w/ Display Templates SHAREPOINT SATURDAY ATLANTA – JUNE 21, 2013 MIKE ORYSZAK BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK

2. SPSATL 2014 About Me  Senior SharePoint Solution Architect w/ B&R Solutions  Microsoft SharePoint Server MVP (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 Scan the QR code for a chance to win a prize! BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 2

3. 3 SharePoint Saturday Atlanta3 |SharePoint Saturday Atlanta

4. 4 SharePoint Saturday Atlanta4 |SharePoint Saturday Atlanta

5. 5 SharePoint Saturday Atlanta5 |SharePoint Saturday Atlanta

6. 6 SharePoint Saturday Atlanta6 |SharePoint Saturday Atlanta Lunch Snack SharePint Speaker Shirts Attendee Shirts Abel Solutions Speaker Dinner

7. SPSATL 2014 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 7

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

9. SPSATL 2014 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 9

10. SPSATL 2014 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 10

11. SPSATL 2014 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 11

12. SPSATL 2014 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 12

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

14. SPSATL 2014 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 14

15. SPSATL 2014 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 15

16. SPSATL 2014 Working With People Results  Working with People results and presence BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 16

17. SPSATL 2014 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 17

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

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

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

21. SPSATL 2014 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/ BLOG: WWW.MIKEORYSZAK.COM TWITTER: @NEXT_CONNECT LINKEDIN: HTTP://WWW.LINKEDIN.COM/IN/MICHAELORYSZAK 21

22. 22 SharePoint Saturday Atlanta22 |SharePoint Saturday Atlanta Join us for SharePint

23. 23 SharePoint Saturday Atlanta23 |SharePoint Saturday Atlanta SharePint Directions