Displaying SharePoint 2013 Search Results in a Table

Scot Hillier

by Scot Hillier on 2/9/2015

Share this:
Print

Article Details

Date Revised:
2/9/2015


Recently, I had a requirement to show SharePoint 2013 search results in a table. I started by looking over Corey Roth’s excellent article that creates a table and uses the jQuery Data Tables library to make it look good. While Corey’s article is a great in-depth examination of display templates, I was after a simpler approach that didn’t rely on third-party libraries and was based on div tags instead of table tags. My idea was to use display: table, display: table-row, and display: table-cell to format the results. I also wanted to include a custom flyout below the result row when you hover over the item. Figure 1 shows my end result. 

Figure 1, Search Results in a Table

If you want to use these display templates, start by simply downloading them from the IT Unity GitHub repo. Then upload the templates without modification into the master page gallery at /_catalogs/masterpage/Display%20Templates/Search. Next, go to your Search Center, and place the results page in edit mode. Select to edit the search results web part. Then set the Results Control Display Template to Table Result and the Item Display Template to Table Item

Figure 2, Configure the search results web part

That's it! Now your search results will appear in a table.

 


Topic: Development

Sign in with

Or register

  • Thanks Scott. Very helpful blog
  • This is exactly what we need Scot! ICan''''t figure out how to employ a copy of the OOTB PDF Hoverpanel though... what''''s the secret?
  • I have a problem where in a specific Sharepoint site it works and in another it doesn't. What could be the reason?
  • Brilliant
  • Hi! Is this template include sorting when clicking columns' title?
  • ss
  • can we make it display SharePoint OTB overlay popup instead the customized one?
  • Could you please tell me is there any way to export results table to excel sheet?
  • Is it normal for these files to not create corresponding .js files?
    I am not seeing these template in the Search Results web part.
  • Thanks, Matthew. I updated the code in the repo and successfully used the templates in an Office 365 site. Should be all set.
  • I just tried this out and there is a typo in the Control template. It uses urlHtmlEncodeString in several places. Change this to urlHtmlEncode and it works. Also, this is a Search Result Template, not a Content By Search template. If you want CBS you'll have to roll your own with Scot's files as a guide.
  • after uploading the files, I still cannot see them under Display templates:
    http://i.imgur.com/KGEpPal.png
  • it doesnt work.
  • Great article, thank you - I have tried using the templates for the content search webpart but I get errors, is there something specific I need to change in the code to allow them to run?
  • This is great Scot! Do you have a version of this where the columns are sortable?