Integrating Search Driven Content in SharePoint 2013

RITA ZHANGERIC OVERFIELD

About Us Founder and SharePoint

Branding/UI Lead, PixelMill

Speaker, Teacher, Advocate

Author, SharePoint

Community Organizer

Sr. Consultant, Microsoft

Founder and Architect,

SP.me

Author

“Pro SharePoint 2013 Branding and

Responsive Web Development” (Apress – June

2013)

ericoverfield.com

@EricOverfield

blogs.msdn.com/ritazh

@SharePointRita

You will learn how to…Aggregate content from different sites

cross-site publishing feature

Create a content rollup solutioncustom display templates

Fine-tune search queries and customize the display of search results

query rules and result types

1

2

3

What we want to build… Scenario: Show dynamic content

Show potential buyers a rollup of all the available Specter Group properties for sale

Site Collection A

SearchSearch Crawl

Content Search Web Part

Site Collection B

Site Collection C

Site Collection D

List of articles/documentsRecommendationsPopular items

Solution

My Content

Enable Catalog

Create Managed Property1. After you crawl the

content

2. Create a new Managed property from a crawled property

Getting Content from Catalog1

2

3

Content Rollup with Content Search Web Part

Getting the results: Query Builder

Showing the results: Display Templates

Get Dynamic Content with Query Builder

1

2 3

Show Results with Display Templates

Your own display templates

1.Place them in the Master Page Gallery

2.Copy one of the existing ones for best results

3.Use the editor of your choice

What makes up a display template

• Retrieve managed properties• HTML and JavaScript instead

of XSL

Let’s look at the code…<mso:ManagedPropertyMapping msdt:dt="string"> 'LastModifiedTime':'LastModifiedTime', 'Specter Property Type'{Specter Property Type}:'SpecterPropertyType', 'Picture URL'{Picture URL}:'PublishingImage;PictureURL;PictureThumbnailURL', 'Link URL'{Link URL}:'Path', 'Line 1'{Line 1}:'Title', 'Line 2'{Line 2}:'Description', 'SecondaryFileExtension', 'ContentTypeId'</mso:ManagedPropertyMapping>

<span class="_#= specterPropertyType=#_"> <a href="_#= linkURL =#_" class="thumb"> _#= pictureMarkup =#_ <div class="date"> <div class="d">_#= date=#_</div> <div class="m">_#= month=#_</div> </div> </a> <div class="caption">Property Type: _#= specterPropertyType=#_</div></span>

var specterPropertyType = $getItemValue(ctx, "SpecterPropertyType");var lastModifiedTime = $getItemValue(ctx, "LastModifiedTime");

SummaryCustom display templates

1. Copied an existing display template

2. Added a new display slot for a new managed property

3. Customized the display of results with css and JavaScript

Design Components and Mappings in SharePoint

Component Type File SharePoint Artifacts

Style for the entire result set block and for each search result item

CSS style.cssCSS file in the Master Page Gallery:/Spectergroup/css/style.css

Structure for the entire block of results

HTML tag: <ul> Control_List_Specter

Custom Control display template in the Master Page Gallery:/Display Templates/Content Web Part/Control_List_Specter.html

Display content for each result item

HTML tag: <li> Item_LargePicture_Specter

Custom Item display template in the Master Page Gallery:/Display Templates/Content Web Part/Item_LargePicture_Specter.html

Pre-process data for each result item

JavaScript Inline JavaScript in Item_LargePicture_Specter

Custom Item display template in the Master Page Gallery:/Display Templates/Content Web Part/Item_LargePicture_Specter.html

Quick test…raise your hand when you’re done

Ready?

Find the PDF

Now find Joanna’s project

What’s the problem? Results all look the same All the documents and sites are not the same

We’re forced to search between results

What we want to build… Scenario: Customized search experience

When users search for "floor plans“: Promote beachfront properties in the summer Promote floor plans result type as best bets

Create a Query Rule1. Condition: Set of conditions to match for this

rule to fire2. Action: What to do when this rule is applied3. Publishing: When should the rule be active

Your own Query RuleAdd a Summer Promotion for Beachfront Properties

1 2 3

Result TypesTailor the look of important types of results.

One of these things…is not like the other.

Conditions match result properties to identify a “type” of result.

A Display Template changes the look of that type of result.

Your own Result Type1

2

SummaryQuery Rule and Result Type

1. Created a Query Rule to Add a Summer Promotion for Beachfront Properties

2. Added a Result Type for Floor Plans to Use Best Bet Item Display Templates

You have learned how to…Aggregate content from different sites

cross-site publishing feature

Create a content rollup solutioncustom display templates

Fine-tune search queries and customize the display of search results

query rules and result types

1

2

3

Resources Configure cross-site publishing in SharePoint 2013: http://technet.microsoft.com/en-us/library/jj656774.aspx

Connect a publishing site to a catalog: http://technet.microsoft.com/en-us/library/jj679901.aspx

Administer search in SharePoint Server 2013: http://technet.microsoft.com/en-us/library/ee792877.aspx

Display template reference in SharePoint Server 2013: http://technet.microsoft.com/en-us/library/jj944947.aspx

Understanding the display template structure: http://msdn.microsoft.com/en-us/library/jj945138.aspx#bk_DTstructure

Make a query rule inactive: http://technet.microsoft.com/en-us/library/jj871014.aspx#BKMK_MakeInactive

Create query rules: http://technet.microsoft.com/en-us/library/jj871014.aspx

Customize search result types: http://technet.microsoft.com/en-us/library/dn135239.aspx

Integrating Search Driven Content in SharePoint 2013

Thank You

Thank You to Our Sponsors

Join us right after the event at the Firehouse Grill! Socialize and unwind after our day of learning.

1765 E. Bayshore RoadEast Palo Alto, CA

Don’t Forget SharePint

Thank you for joining us Today!