XSL Examples

XSL Examples Overview

The XSL Examples topic includes codes snippets and explanations about specific XSL usage and techniques.

Styling Broken Links

When a page contains broken links, the page is listed on the Broken Pages report, which can be navigated to from Reports > Required Actions > Broken Pages. The page with the broken link can be previewed by clicking the linked page name. Users can hover over links to view the broken link indication. Another way to help users identify broken links is to add an xsl:if statement to the XSL that adds customized CSS.

The following XSL code tests in order to determine the mode and if the mode is not publish; that is, if it is edit, preview, or compare, then it adds [BROKEN LINK!] in red text.

The xsl:if should be added to the <head> element of the page.

<xsl:if test="$ou:action != 'pub'">
        a[href$=' ***']:after {
            content:    "[BROKEN LINK!]";
            color: red;

This injects custom CSS onto the page at the time of transformation as long as it is not being published (so that the styling does not appear on the published page).

It is applied to any link with an href attribute that ends with " ***" since this is how broken dependency manager links end.

Keep in mind that this provides additional broken link styling for preview, edit, or compare, but not within the WYSIWYG Editor. 

Method 2

An alternative method is to use a template match in the XSL rather than CSS. This can be used when using xsl:apply-templates. For example, it can be added to the /_resources/xsl/_shared/template-matches.xsl file.

<!-- Visual warning for broken dependencies tags -->
<xsl:template match="a[contains(@href,'*** Broken')]" mode="copy"> <a href="{@href}" style="color: red;"><xsl:value-of select="."/></a>&nbsp;<span style="color: red;">[BROKEN LINK]</span> </xsl:template>