How to customize search results look by using result types and display templates in SharePoint Online and SharePoint 2016/2013?

Sharepoint 2013 search

Hi folks today we are going to discuss little about Display templates in SharePoint Server 2013 as an intro and then in Part II I’ll modify and show you guys the output of my Search page so let’s just jump into the topic. Display templates are templates used in Web Parts that use search technology (referred to in this article as Search Web Parts) to show the results of a query made to the search index. Display templates control which managed properties are shown in the search results, and how they appear in the Web Part. Each display template is made of two files: an HTML version of the display template that you can edit in your HTML editor, and a .js file that SharePoint uses.

You can navigate Display Template by below URL just replace yours



E.g.- https://onlysharepoint2013.sharepoint.com/sites/Bhawana/_catalogs/masterpage/Forms/AllItems.aspx

SharePoint deveopment training course
SharePoint 2013 search results and display template
SharePoint 2013 search results and display template

Below under Search you can find two template files starts from Control and Item, again divided into .html and .js. So Search result page when we are looking .html will contain all design related elements like table , divs, panels like that and in .js file all related scripts used in .html.

How to customize search results look by using result types and display templates in SharePoint 2016 SharePoint 2013 ?
How to customize search results look by using result types and display templates in SharePoint 2016 SharePoint 2013 ?
How to customize search results look by using result types and display templates in SharePoint 2016 ?
How to customize search results look by using result types and display templates in SharePoint 2016 ?

So if you want to customize you search result page below are the elements and controls we need to take care. And based on our need we can alter, remove, hide and update. In fact, we have full control over the elements visible in this page. Also, we can restrict the audience by viewing and accessing the search contents.



customize search results sharepoint 2013
customize search results sharepoint 2013
customize search results sharepoint online
customize search results sharepoint online

Read some sharepoint online tutorials:

Hope this article will be helpful!! Get ready for the next part.

Check out Best Alternative to InfoPath -> Try Now

free sharepoint training

SharePoint Online FREE Training

JOIN a FREE SharePoint Video Course (3 Part Video Series)

envelope
envelope

About Bhawana Rathore

Hello Everyone!! I am Bhawana a SharePoint MVP and having about 8+ years of SharePoint experience as well as in .Net technologies . I have worked in all the versions of SharePoint from wss to Office 365. I have good exposure in Customization and Migration using Nintex, Metalogix tools . Now exploring more in SharePoint 2016 :) Hope here I can contribute and share my knowledge to the fullest. As I believe "There is no wealth like knowledge, and no poverty like ignorance"

View all posts by Bhawana Rathore →