Template Variables

When creating or porting a theme to Mura, it's important to account for the variables used to output content from Mura. Use this guide to ensure your new templates output Mura content correctly.

templates/inc/html_head.cfm

Meta Description

#$.getMetaDesc()#

Outputs Meta Description found on the "Metadata" tab when editing a page or portal.

Usage:
<meta name="description" content="#HTMLEditFormat($.getMetaDesc())#" />

Meta Keywords

#$.getMetaKeywords()#

Outputs Meta Keywords found on the "Metadata" tab when editing a page or portal.

Usage
<meta name="keywords" content="#HTMLEditFormat($.getMetaKeywords())#" />

Credits

#$.content('credits')#

Outputs the contents of the "Credits" field found on the "Metadata" tab when editing a content node.

Usage
<cfif request.contentBean.getCredits() neq ""><meta name="author" content="#HTMLEditFormat($.content('credits'))#" /></cfif>

Mura Version

#$.globalConfig('version')#

Outputs the version of Mura used to publish the page or portal.

Usage
<meta name="generator" content="Mura CMS #$.globalConfig('version')#" />

Browser Title

#$.content('HTMLTitle')# #$.siteConfig('site')#

Outputs the title specified in the HTML/Browser Title (when editing a node) and the Site Name (found in Site Settings).

Usage
<title>#HTMLEditFormat($.content('HTMLTitle')# - #HTMLEditFormat($.siteConfig('site'))#</title>

Favicon

<link rel="icon" href="#$.siteConfig('assetPath')#/images/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="#$.siteConfig('assetPath')#/images/favicon.ico" type="image/x-icon" />

Outputs a link to a favicon file included in a theme's "images" directory. Declaring both allows consistent output across browsers while overriding the default location in the root of a Mura install. This also allows each Mura site to have a unique favicon.

Path Variables

#$.siteConfig('assetPath')#
Outputs a root relative path to the root of a site, including the context, i.e. if Mura is installed in a subdirectory of your webroot.

Usage
<link rel="stylesheet" href="#$.siteConfig('assetPath')#/css/default.css" type="text/css" media="all" />

#$.siteConfig('themeAssetPath')#
Outputs a root relative path to the root of a theme, including the context.

Usage
<link rel="stylesheet" href="#$.siteConfig('themeAssetPath')#/css/site.css" type="text/css" media="all" />

Alternate Content (RSS)

Dynamically loops through all Local Indexes and outputs links to all "public" RSS feeds created. When present, some browsers may show an RSS icon in the location field to indicate RSS feeds are available.

<cfset rs=$.getBean('feedManager').getFeeds($.event('siteID'),'Local',true,true) />
<cfloop query="rs">
<link rel="alternate" type="application/rss+xml" title="#HTMLEditFormat($.siteConfig('site'))# - #HTMLEditFormat(rs.name)#" href="#XMLFormat('http://#listFirst(cgi.http_host,":")##$.globalConfig('context')#/tasks/feed/?feedID=#rs.feedID#')#" />
</cfloop>

templates/inc/header.cfm

Site Root URL

#$.createHREF(filename='')#

Creates a URL based on the filename (or ) of the page.

Site Name

#$.siteConfig('site')#

Usage
<h1><a href="#$.createHREF(filename='')#">#HTMLEditFormat($.siteConfig('site')#</a></h1>


cf_CacheOMatic Tag

<cf_CacheOMatic key="dspPrimaryNav#request.contentBean.getcontentID()#"></cf_cacheomatic>

The cf_CacheOMatic Tag can be used to great effect to cache less frequently updated items that have greater application server overhead. It is used in conjunction with the "Caching" option in "Site Settings". The cf_CacheOMatic Tag will not enable caching unless caching is turned on. The key prefix (in this case, dspPrimaryNav) can be used to give context to the unique variable, #request.contentBean.getcontentID()#, created for the cached item.

Primary Navigation

#$.dspPrimaryNav(
viewDepth="2",
id="navPrimary",
displayHome="Always",
closePortals="true",
showCurrentChildrenOnly="false"
)#

Outputs a nested unordered list to create the primary or top level navigation of a site with or without dropdown navigation.

Named Arguments

viewDepth: Expects a numeric value to indicate how "deep" each top level nav should go when listing its children. It is not recommended to set this greater than 1 or 2 due to the overhead required to parse a nodes "current" location and permissions. "0" results in no dropdowns or current children shown.

id: This is the element id of the <ul> used to output primary navigation. This can be changed to whatever you need.

displayHome: Allows configuration to include the link to home page in the primary nav at all times (always), at no time (never), or only when not on the home page itself (conditional).

openPortals/closePortals: Allows the toggling of portals to show or not show children in the Primary Navigation. Options are: true, false, or a comma delimited list of content id's (found on the "advanced" tab of any content node) that specify which portals are to be "closed" or "open."

showCurrentChildrenOnly: Allows restricting the output of child nodes within the navigation. Useful when used in conjunction with the viewDepth setting above and implemented in a vertical orientation.

Templates

Section-Specific CSS Hook

#$.getTopID()#

Outputs an all lowercase, concatenated string based on the "Navigation" or "Menu" title of a top-level (immediately below the homepage) content node. Can be used to create section-specific CSS selectors.

Usage
<body id="#$.getTopID()#" class="threeCol">

Page-Specific CSS Hook

#$.createCSSid($.content('menuTitle')#

Outputs a concatenated, camel-case string based on the navigation or "Menu" title of a specific content node. Incidentally, the "createCSSid()" function can be used on any variable to create a CSS-friendly string.

Usage
<div id="container" class="#$.createCSSid($.content('menuTitle'))#">

Depth-Specific CSS Hook

depth#arrayLen($.event('crumbdata'))#

Outputs a string that indicates the depth of the content node within the site architecture. "depth" is pre-pended to make sure the CSS hook doesn't begin with a number (an invalid CSS naming convention in some browsers).

Usage

<div id="container" class="#$.createCSSid($.content('menuTitle'))# depth#arrayLen($.event('crumbdata'))#"

Breadcrumb Navigation

#$.dspCrumbListLinks("crumbList","&nbsp;&raquo;&nbsp;")#

Outputs an unordered list of links to create breadcrumb navigation. The first argument defines the name of the ID attribute of the list while the second defines the separator between each list item.

Body Content

#$.dspBody(body=$.content('body'),pageTitle=$.content('title'),crumbList=0,showMetaImage=1)#

Named Arguments

body: Defaults to "request.contentBean.getbody()" and should not be changed.

pageTitle: Defaults to "request.contentBean.getTitle()" and while, technically, it can be changed to something else, it probably shouldn't.

crumbList: DEPRECATED. Options are 1, 0. If set to 1, will output breadcrumb navigation below the page title.
showMetaImage: Options are 1, 0. Outputs a "medium" associated image that includes a link to the "large" version and will display in "lightbox" mode.

showMetaImage: Options are 1, 0. If set to 1, will output the "medium" sized image associated with a specific node with a link to view the "large" associated image via shadowbox.


Display Region

#$.dspObjects(1)#

Outputs rendered content objects defined in each nodes "content objects" tab. Up to 8 regions are available and can be configured in "Site Settings."

Usage
#$.dspObjects(1)#, #$.dspObjects(2)#, #$.dspObjects(3)#