This article will cover how you can add a web part on the SharePoint 2010 search page which will display the search term.

The search result page in SharePoint 2010 is intuitive and comes with great features like refinements, ranking or best bets and a lot more. This page can also be rebranded and the actual results that show in the Search Core Results Web Part can be modified by in many ways with XSL. On top of this you can add you own web parts in the web part zones.

Let us look how to improve the search user experience and display the word the user searched for, this could specially be useful if this is about a public faced web site and the search box may not be direct at top of the core results.

How to do this with help of a bit java script and a content editor:

  • Create a .TXT file and insert the script below this instruction, give it the name SearchKeyword.txt and upload this to a folder in SharePoint, you can create a new folder in the root called Scripts if you wish.
  • Edit the search result page and add the Web Part called Content Editor to the zone just above the Search Core Results Web Part.
  • Edit the Web Part and type the link in the URL field to the .TXT file. Set Chrome Type to None.


<style type="text/css">
#SearchCoreHeader {
line-height: 42px; font-family: Georgia; font-size: 26px;
margin-bottom: 15px; margin-left: 15px; color: #747a6d; 
}
</style>

<div id="SearchCoreHeader">
  You searched for:

<script type="text/javascript">
 var urlParams = {};
  (function () {
    var e,
        a = /\+/g, 
        r = /([^&;=]+)=?([^&;]*)/g,
        d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
        q = window.location.search.substring(1);

    while (e = r.exec(q))
       urlParams[d(e[1])] = d(e[2]);
  })();

 document.write("<span>");
 document.write(urlParams["k"]);
 document.write("</span>");
</script>

</div>

 

Happy SharePointing!

Advertisements