Using Render Variables

The Component Templates use HTML / EJS to take the Component Data and Component Properties, and transform them into the resulting HTML.

The Render Variables are built-in JavaScript variables that can be used to dynamically render component content and build advanced components.

Render Variables are used directly in the EJS:

<div>
<%=templateName%>
</div>

Built-in Render Variables

The following variables can be used in any Component Render Template EJS / HTML:

renderType (string) Component Type - "content", "page", or "site"
templateName (string) Component Template Name
baseUrl (string) The CMS server base URL <cms._baseurl>
  * On publish, baseUrl will be an empty string
componentRenderClass (string) Unique class name for inline template styles or scripts
* This class cannot be used outside of the component itself - is dynamically regenerated each time the component is rendered
isInEditor (bool) Whether the render is in the Page Editor
isInPageEditor (bool) Whether the render is in the Page Editor Preview
isInComponentEditor (bool) Whether the render is in the Edit Component Popup
sitemap (object) <cms.controller.sitemap>
The primary sitemap
* If sitemap is used in an Export Component, it will only contain the "sitemap_items" property
menu (Optional) (object) <cms.controller.menus[menu_tag]>
If the cms-menu-tag attribute is set on the component object or in the export parameters, the menu variable will be populated with that menu
data (object: { item: <object>, items: Array<object> })  (Component Data Values)
    item :: (object) The Component Data item as an object, if the "multiple_items" component config property is false
    items :: (Array<object>) The Component Data Items array
properties (object) (Component Properties Values)
--- Aliases ---
items Alias to the "data.items" Array (Component Data)
item Alias to the "data.item" Object (Component Data)
component Alias to the "properties" Object (Component Properties)

Content Component / Page Component Render Variables

Content components and page components provide the following additional render variables:

page (object) <cms.controller.page>
template (object) <cms.controller.template>

Export-only Render Variables

Site components provide the following additional render variables during export:

sitemaps (object) Dictionary of all sitemaps, indexed by sitemap type
menus (object) Dictionary of all menus, indexed by menu tag
site_redirects (Array) Site redirects, configured in the Pages > Redirects grid
page_paths (object) Dictionary of Page URL to Page Path mapping
* Pages that are the default documents in a folder will have two entries:
  /path/to/folder/
  /path/to/folder/index.html
branchData (object) Publish branch data
publish_params (object) Publish target parameters

Object: menu

The menu object has the following properties:

tag (string) Menu tag
tree (Array<menu_item>) Top-level menu items
* Tree can be traversed using the menu_item.children property
topItems Alias for "tree" property
allItems (Array<menu_item>) All items in the menu
items Alias for "allItems" property
currentItem (menu_item) The current selected menu item, based on the current page
--- System Properties ---
menu_tag Alias for "tag" property
menu_key (number) CMS Menu Key identifier
menu_item_tree Alias for "tree" property
menu_items Alias for "allItems" property

Object: menu_item

The menu_item object has the following properties:

id (number) Internal Menu Item ID
children (Array<menu_item>) Array of this menu item's children
getSiblings() (Function) Returns an array of this menu item's siblings
parents (Array<menu_item>) Array of this menu item's parent hierarchy, tracing back to root
parent (menu_item) This menu item's immediate parent
depth (number) Depth of this menu item from root
html (string) HTML for the menu item text
text (string) Menu item text stripped of any HTML tags
tag (string) The tag property, if defined in the menu item's Advanced Options
class (string) CSS Class, if defined in the menu item's Advanced Options
style (string) CSS Style, if defined in the menu item's Advanced Options
href (string) Menu item URL.  If the link type is "JS", this will be set to "#"
onclick (string) Menu item onclick JS function, if the link type is "JS"
target (string) Menu item link target - value is "_blank" if target is "New Window"
selected (bool) Whether the current page is the same as the menu item link destination
---- System Properties ---
menu_item_id Alias for "id" property
menu_item_parent_id (number) ID of this menu item's immediate parent
menu_item_path (Array<number>) The IDs of all menu items from the root to this item
menu_item_text (string) The raw menu item text field
menu_item_type (string) Menu item type - "TEXT" or "HTML"
menu_item_tag Alias for "tag" property
menu_item_style Alias for "style" property
menu_item_class Alias for "class" property
menu_item_link_type (string) Menu item link type - "PAGE", "MEDIA", "URL", or "JS"
menu_item_link_dest (string) The raw menu item link destination
menu_item_link_target (string) Menu item link target - "NEWWIN" or empty string
menu_item_children Alias for "children" property

Object: sitemap

The sitemap object has different properties available for Content / Page Components and Site Export Components.

Relative Sitemap Properties (Content / Page Components)

A "relative sitemap" is the relative to the current page, and factors in Advanced Sitemap Item Options, such as "Hide Parents", "Hide Siblings", and "Hide Children".  Each page has a unique perspective of the sitemap, so the relative sitemap is the sitemap from the perspective of that page.

The relative sitemap properties are available to Content and Page Components:

currentItem (sitemap_item) Current sitemap item, based on the current page
tree (Array<sitemap_item>) Top-level sitemap items in relative sitemap
* Tree can be traversed using the sitemap_item.children property
topItems Alias for "tree" property
allItems (Array<sitemap_item>) All items in the relative sitemap
root (sitemap_item) Root-most element of the relative sitemap
parents (Array<sitemap_item>) Hierarchy from root to current sitemap item
children (Array<sitemap_item>) List of current sitemap item's children
breadcrumbs (Array<sitemap_item>) Breadcrumbs for the current page
self Alias for "currentItem" property
item Alias for "currentItem" property

 

Export Properties (Site Components)

The following properties are available for Site components during Export:

tree (Array<sitemap_item>) Top-level sitemap items in sitemap
* Tree can be traversed using the sitemap_item.children property
topItems Alias for "tree" property
allItems (Array<sitemap_item>) All visible items in the sitemap
sitemap_items Array<sitemap_item> List of all items in the sitemap, including hidden items

Object: sitemap_item

The sitemap_item object has the following properties:

id (number) Internal Sitemap Item ID
children (Array<sitemap_item>) Array of this sitemap item's children
getSiblings() (Function) Returns an array of this sitemap item's siblings
siblings (Array<sitemap_item>) This sitemap item's siblings
parents (Array<sitemap_item>) Array of this sitemap item's parent hierarchy, tracing back to root
parent (sitemap_item) This sitemap item's immediate parent
depth (number) Depth of this sitemap item from root
html (string) HTML for the sitemap item text
text (string) Sitemap item text stripped of any HTML tags
tag (string) The tag property, if defined in the sitemap item's Advanced Options
class (string) CSS Class, if defined in the sitemap item's Advanced Options
style (string) CSS Style, if defined in the sitemap item's Advanced Options
href (string) Sitemap item URL.  If the link type is "JS", this will be set to "#"
onclick (string) Sitemapitem onclick JS function, if the link type is "JS"
target (string) Sitemap item link target - value is "_blank" if target is "New Window"
selected (bool) Whether the current page is the same as the sitemap item link destination
---- System Properties ---
sitemap_item_id Alias for "id" property
sitemap_item_parent_id (number) ID of this sitemap item's immediate parent
sitemap_item_path (Array<number>) The IDs of all sitemap items from the root to this item
sitemap_item_text (string) The raw sitemap item text field
sitemap_item_type (string) Sitemap item type - "TEXT" or "HTML"
sitemap_item_tag Alias for "tag" property
sitemap_item_style Alias for "style" property
sitemap_item_class Alias for "class" property
sitemap_item_exclude_from_breadcrumbs (bool) Whether to exclude this sitemap item from the breadcrumbs
sitemap_item_exclude_from_parent_menu (bool) Whether to exclude this sitemap item from its parent's and siblings' relative sitemaps
sitemap_item_hide_menu_parents (bool) Whether to exclude this sitemap item's parents from its relative sitemap
sitemap_item_hide_menu_siblings (bool) Whether to exclude this sitemap item's siblings from its relative sitemap
sitemap_item_hide_menu_children (bool) Whether to exclude this sitemap item's children from its relative sitemap
sitemap_item_link_type (string) Sitemap item link type - "PAGE", "MEDIA", "URL", or "JS"
sitemap_item_link_dest (string) The raw sitemap item link destination
sitemap_item_link_target (string) Sitemap item link target - "NEWWIN" or empty string
Loading
Loading