CMS Breadcrumbs
Breadcrumb navigation is a user interface element commonly used in websites and applications to provide a hierarchical pathway for easy navigation and orientation within a website's structure. It typically appears as a horizontal trail of clickable links, usually located near the top of the page or within a designated navigation bar.
You can add breadcrumbs to your sections and folders, using XSL, and you can also use them in Layout Builder. These values were often edited inside of a file called _props.pcf
, _properties.pcf
, or similar file. To populate a Breadcrumb on section or folder creation referrer to System Level Variable for TCFs.
XSL Function to Get CMS BreadcrumbsLink to this section
Add the following function to functions.xsl
,or similar file, to get the breadcrumbs from any folder. If the folder does not exist, it will not return anything.
<xsl:function name="ou:get-folder-properties" expand-text="yes">
<xsl:param name="folder-path" />
<xsl:variable name="dirapi" select="'ou:/Directories/GetProperties?site=' || $ou:site || '&path=' || $folder-path" />
<xsl:if test="doc-available($dirapi)">
<xsl:copy-of select="doc($dirapi)" />
</xsl:if>
</xsl:function>
Calling the XSL FunctionLink to this section
Call the function where you want the breadcrumbs to output, typically interior.xsl
, landing.xsl
, or similar. The following is an XSL call for a folder named /about
.
<xsl:copy-of select="ou:get-folder-properties('/about')" />
Return XML StructureLink to this section
The following is a sample return of the breadcrumbs for a folder called /about
. The method will return the all breadcrumbs to the home folder. You can then write custom XSL to format the breadcrumbs for display.
<folders>
<folder path="/" level="0">
<breadcrumb>Home</breadcrumb>
<breadcrumb-stop>(true or false)</breadcrumb-stop>
<breadcrumb-skip>(true or false)</breadcrumb-skip>
</folder>
<folder path="/about/" level="1">
<breadcrumb>About</breadcrumb>
<breadcrumb-stop>(true or false)</breadcrumb-stop>
<breadcrumb-skip>(true or false)</breadcrumb-skip>
</folder>
</folders>
If you would like us to add this feature to your existing implementation, contact our helpdesk.