The Ugly, the Bad and the Good (Part 2)

Part 2. The Bad

Add your own icons with the same name as the refiner value to the images folder.

Only one extra row of XSL is needed to do the trick: find and show the icon with the filter value in the Refinement panel.

Add via the XSL Editor the following rows to the <xsl:template name="FilterLink">:

<xsl:if test="($Indentation = '1')">
  <span class="ms-searchref-indenticon">&#8627;&#160;</span>
</xsl:if>
<!-- Begin -->
  <!-- find your own added icons with same name as the filter value, or else default icon  -->
  <img align="absmiddle" src="/_layouts/images/{$Value}.gif" onError="this.src='/_layouts/images/bullet.gif';" border="0" />
  <!-- space -->
  <xsl:text> </xsl:text>
<!-- End -->
<a class="ms-searchref-filterlink" href="{$SecureUrl}" title="{$RefineByHeading}: {$UrlTooltip}">
  <xsl:value-of select="Value"/>
</a>

But there must be a smarter way to get the standard icons that are already available. The sequel continues with Part 3.