URL or Links
Basic Link
<a>
<xsl:attribute name="href">
<xsl:value-of select="@DispForm"/>
</xsl:attribute>
<xsl:value-of select="$DisplayTitle"/>
</a>
Read More Link
<a>
<xsl:attribute name="href">
<xsl:value-of select="@DispForm"/>
</xsl:attribute>
read more…
</a>
Dates
New Zealand Date Format (30 March 2016)
Change the '3' to vary date format (e.g., '1' will display 30/03/2016)
<xsl:value-of select="ddwrt:FormatDate(@StartDate, 2057, 3)"/>
Images
Basic Image from Picture Field
<img border="0" src='{@PostImage}' alt='{@PostImage.desc}' title='{@PostImage.desc}'/>
Conditional Image Display
Shows nothing if image field is blank
<xsl:choose>
<xsl:when test="@PostImage != ''">
<img border="0" src='{@PostImage}' alt='{@PostImage.desc}' title='{@PostImage.desc}'/>
</xsl:when>
<xsl:otherwise>
</xsl:otherwise>
</xsl:choose>
PDF Icon
<div class="pdficon">
<a href='{$SafeLinkUrl}' title='{@LinkToolTip}' target="_blank">
<img src="/_layouts/15/images/icpdf.png?rev=36"></img>
</a>
</div>
HTML
Parse Field as HTML
Renders HTML content instead of escaping it
<xsl:value-of select="@Author" disable-output-escaping="yes" />
Conditional Styling
Set div based on field value
Apply different CSS classes based on field values
<xsl:if test="@Urgency = 'High' ">
<div class="High">
</div>
</xsl:if>
<xsl:if test="@Urgency = 'Low' ">
<div class="Low">
</div>
</xsl:if>
Tips and Best Practices
- •Always test your XSL transformations in a development environment first
- •Use conditional statements to handle empty fields gracefully
- •Remember to escape special characters when not using disable-output-escaping
- •Keep your XSL code organized and well-commented for future maintenance
Need Help with SharePoint XSL Development?
Our SharePoint experts can help you create custom XSL transformations and optimize your Content Query Web Parts for better performance and user experience.