Hiding search suggestion in Search Results Web Part

I have page in SharePoint where users can search for specific type of items and see different results in Search Results Web Parts. The page I have has eight results web parts and when nothing is found I want to keep results web parts laconic and minimal so they don’t waste space on screen.

What I want is shown on following two screenshot fragments.

SharePoint Search Results Web Part with suggestionsSharePoint Search Results Web Part with suggestions

Easiest thing to do is using Script Editor Web Part and add some styling to hide the suggestions block. Here are styles I added.

<style>
    #NoResult div, #NoResult ul {
        display: none
    }
    #NoResult .ms-srch-result-noResultsTitle {
        display: inherit
    }
    .ms-srch-result-noResultsTitle {
        padding-bottom: 0px;
    }
</style>

Now suggestions block is hidden and web parts with no results doesn’t take room so much anymore. What I have now is shown on the following screenshot fragment.

SharePoint Search Results Web Part with suggestions hidden

In case of sites with more custom styling I suggest to have custom stylesheet that is included to masterpage. If it’s just one page like I have then it’s also okay to go with Script Editor Web Part.

Gunnar Peipman

Gunnar Peipman is ASP.NET, Azure and SharePoint fan, Estonian Microsoft user group leader, blogger, conference speaker, teacher, and tech maniac. Since 2008 he is Microsoft MVP specialized on ASP.NET.

    2 thoughts on “Hiding search suggestion in Search Results Web Part

    • November 29, 2017 at 12:40 pm
      Permalink

      Why not simply use the ‘EmptyMessage’ WebPart Property? You can Export the Webpart, edit the message and re-add the Webpart and you are clean. No additional CSS needed.

    • November 30, 2017 at 12:28 pm
      Permalink

      We tried this too but going with CSS gave us better results.

    Leave a Reply

    Your email address will not be published. Required fields are marked *