Part 3. The Good
Different ways to get the right icon for every filter value in the Refinement panel.
After exploring the possibilities in XSL I came up with this hybrid approach:
- Look for Result Type icons in the docicon.xml file on the server;
- Look for icons with the same name as the filter value in the images folder;
- Several when-statements for specific matches;
- Default icon if there's no match.
Add via the XSL Editor the following rows to the <xsl:template name="FilterLink">:
<xsl:if test="($Indentation = '1')">
<span class="ms-searchref-indenticon">↳ </span>
</xsl:if>
<!-- Begin -->
<xsl:choose>
<!-- for the Any of every category -->
<xsl:when test="starts-with($Value, 'Any ')">
<img align="absmiddle" src="/_layouts/images/asterisk.png" border="0" />
</xsl:when>
<!-- for Site -->
<xsl:when test="starts-with($UrlTooltip, 'http://')">
<img align="absmiddle" src="/_layouts/images/SharePointFoundation16.png" border="0" />
</xsl:when>
<!-- for Result Type - will only work for original values, like Pdf, Zip -->
<xsl:when test="ddwrt:MapToIcon('', $Value) != 'icgen.gif'">
<img align="absmiddle" src="/_layouts/images/{ddwrt:MapToIcon('', $Value)}" border="0" />
</xsl:when>
<!-- for Result Type with custom value -->
<xsl:when test="$Value = 'Word'">
<img align="absmiddle" src="/_layouts/images/icdocx.png" border="0" />
</xsl:when>
<xsl:when test="$Value = 'Excel'">
<img align="absmiddle" src="/_layouts/images/icxlsx.png" border="0" />
</xsl:when>
<xsl:when test="$Value = 'PowerPoint'">
<img align="absmiddle" src="/_layouts/images/icpptx.gif" border="0" />
</xsl:when>
<xsl:when test="$Value = 'Webpage'">
<img align="absmiddle" src="/_layouts/images/icaspx.gif" border="0" />
</xsl:when>
<!-- find your own added icons with same name as the filter value, or else default icon -->
<xsl:otherwise>
<img align="absmiddle" src="/_layouts/images/{$Value}.gif" onError="this.src='/_layouts/images/bullet.gif';" border="0" />
</xsl:otherwise>
</xsl:choose>
<!-- space -->
<xsl:text> </xsl:text>
<!-- End -->
<a class="ms-searchref-filterlink" href="{$SecureUrl}" title="{$RefineByHeading}: {$UrlTooltip}">
<xsl:value-of select="Value"/>
</a>
The result is this pimped up Refinement Panel:
Try it yourself.
Of course it's possible to add separate templates for every category, but that is too much work for now. Maybe later... See Part 4.
No comments:
Post a Comment