Customizing Search Results with Custom XSLTs in SharePoint Server 2007

Article
10/16/2013

Summary: Learn how to customize search results by using custom XSLT transformations in Microsoft Office SharePoint Server 2007.

Office Visual How To

Applies to: Microsoft Office SharePoint Server 2007

Patrick Tisseghem, U2U

December 2007

When users perform search queries by using Microsoft Office SharePoint Server 2007, the search results are rendered by the Search Core Results Web Part. The rendered HTML that users see is actually an XSLT transformation applied to the XML that contains the search results. Learn how you can make a small customization to this XSLT.

Customizing Search Results with Custom XSLTs

Watch the Video

Length: 03:45 | Size: 3.00 MB | Type: WMV file

Code It | Read It | Explore It

Code It

From the Office SharePoint Server Search Center (on the Search tab), type and submit a keyword search. By default, the keyword in the search results is displayed in bold.

Next, for this customization example, assume that you want to highlight the keyword in the search results with a yellow background (instead of the keyword appearing only as bold text).

Copy the Search Core Results XSLT

To modify the search results, first copy the Search Core Results XSLT.

To copy the Search Core Results XSLT

On the search results page, click Site Actions, and then click Edit Page.
In the Bottom Zone, in the Search Core Results Web Part, click edit, and then click Modify Shared Web Part.
In the Search Core Results tool pane, click XSL Editor. Create an empty XML file by using Microsoft Visual Studio 2005, and then copy all the XSLT into the XML file.

Figure 1. Access to the Search Core Results XSLT

Access to the Search Core Results XSLT

Customizing the XSLT

In your new XML file, locate the <xsl:template> tags that match the keywords to highlight. Each of the keywords is represented in the XML returned by the search engine by a value starting with c. Ten keywords can be highlighted in the transformed HTML. Wrap each <xsl:value> tag in a <span> HTML tag that styles it with a yellow background color.

<xsl:template match="c0">
  <span style="background-color:yellow">
    <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c1">
  <span style="background-color:yellow">
    <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c2">
  <span style="background-color:yellow">
    <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c3">
  <span style="background-color:yellow">
     <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c4">
  <span style="background-color:yellow">
     <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c5">
  <span style="background-color:yellow">
     <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c6">
  <span style="background-color:yellow">
     <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c7">
  <span style="background-color:yellow">
     <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c8">
  <span style="background-color:yellow">
     <b><xsl:value-of select="."/></b>
  </span>
</xsl:template>
<xsl:template match="c9">
   <span style="background-color:yellow">
     <b><xsl:value-of select="."/></b>
   </span>
</xsl:template>

After you make the changes, copy the XSLT from Visual Studio and use it to replace the XSLT in the dialog box in the browser. Click Apply, and then click Publish. Verify that the keywords on the search results page are highlighted in yellow.

Figure 2. Search results with customized highlighting

Search results with customized highlighting

Read It

Search results returned by the search engine are returned in XML format. The Search Core Results Web Part takes this XML as input and then applies an XSL transformation on the XML to render the HTML that users see on the search results page. This XSLT is public; it can be modified and replaced with custom XSLT to display results according to your requirements.

Share via