Homepage template

Homepage sections in their configured order.

Output: page body inside the storefront layout.

Data

Shared structures available in recorded contexts: shop, branding, theme, urls, page, navigation, language, languageSwitcher, currencySwitcher, headerActionContributions, labels, security, footer, cartPreview, accountHeader.

Field	Type	Meaning	Availability
`viewModel.home`	object	Home data; check child fields before use.	When the parent is provided; check optional fields.
`viewModel.home.hasActiveVersion`	boolean	Whether active version applies; use for display only.	When the parent is provided; check optional fields.
`viewModel.home.sections`	array	Prepared sections collection; may be empty.	When the parent is provided; check optional fields.
`viewModel.home.sections[].button.hasButton`	boolean	Whether button applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].button.hasLink`	boolean	Whether link applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].button.label`	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].button.linkLabel`	string	Prepared link display text.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].button.url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories`	array	Prepared categories collection; may be empty.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].backgroundImage.alt`	string	Alt value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].backgroundImage.hasUrl`	boolean	Prepared has URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].backgroundImage.height`	number	Height numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].backgroundImage.mediaAssetId`	number	media asset identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].backgroundImage.thumbUrl`	string	Prepared thumb URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].backgroundImage.url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].backgroundImage.width`	number	Width numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].categoryId`	number	category identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].description`	string	Description value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].hasDescription`	boolean	Whether description applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].image.alt`	string	Alt value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].image.hasUrl`	boolean	Prepared has URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].image.height`	number	Height numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].image.mediaAssetId`	number	media asset identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].image.thumbUrl`	string	Prepared thumb URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].image.url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].image.width`	number	Width numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].name`	string	Name value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].categories[].url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].displayVariant`	string	Display variant value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].hasHeadline`	boolean	Whether headline applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].hasTextHtml`	boolean	Prepared HTML; preserve the supplied markup.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].hasTextOverlay`	boolean	Whether text overlay applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].headline`	string	Headline value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].image.alt`	string	Alt value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].image.hasUrl`	boolean	Prepared has URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].image.height`	number	Height numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].image.mediaAssetId`	number	media asset identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].image.thumbUrl`	string	Prepared thumb URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].image.url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].image.width`	number	Width numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items`	array	Prepared items collection; may be empty.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].button.hasButton`	boolean	Whether button applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].button.hasLink`	boolean	Whether link applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].button.label`	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].button.linkLabel`	string	Prepared link display text.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].button.url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].hasHeadline`	boolean	Whether headline applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].hasTextHtml`	boolean	Prepared HTML; preserve the supplied markup.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].hasTextOverlay`	boolean	Whether text overlay applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].headline`	string	Headline value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].image.alt`	string	Alt value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].image.hasUrl`	boolean	Prepared has URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].image.height`	number	Height numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].image.mediaAssetId`	number	media asset identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].image.thumbUrl`	string	Prepared thumb URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].image.url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].image.width`	number	Width numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].text`	string	Text value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].items[].textHtml`	string	Prepared HTML; preserve the supplied markup.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].layoutVariant`	string	Layout variant value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products`	array	Prepared products collection; may be empty.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].badges`	array	Prepared badges collection; may be empty.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].badges[].color`	string	Color value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].badges[].key`	string	Key value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].badges[].label`	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].comparePriceLabel`	string	Prepared compare price display text.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].hasImage`	boolean	Whether image applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].image`	object	Image data; check child fields before use.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].isDiscounted`	boolean	Whether discounted applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].manufacturerId`	number	manufacturer identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].manufacturerName`	string	Manufacturer name value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].name`	string	Name value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].priceLabel`	string	Prepared price display text.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].productId`	number	product identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].shortDescription`	string	Short description value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].sku`	string	Sku value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].tagline`	string	Tagline value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview`	object	Variant preview data; check child fields before use.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups`	array	Prepared groups collection; may be empty.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].items`	array	Prepared items collection; may be empty.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].items[].color`	string	Color value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].items[].image`	object	Image data; check child fields before use.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].items[].label`	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].items[].type`	string	Type value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].items[].url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].items[].value`	string	Value value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].label`	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].remainingCount`	number	Remaining count numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].type`	string	Type value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.groups[].variantGroupId`	number	variant group identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.hasVariants`	boolean	Whether variants applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.items`	array	Prepared items collection; may be empty.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.items[].color`	string	Color value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.items[].image`	object	Image data; check child fields before use.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.items[].label`	string	Label value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.items[].type`	string	Type value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.items[].url`	string	Prepared url URL; use unchanged.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.items[].value`	string	Value value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].products[].variantPreview.remainingCount`	number	Remaining count numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].sectionId`	number	section identifier; do not load data with it.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].sliderEnabled`	boolean	Whether slider enabled applies; use for display only.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].sortOrder`	number	Sort order numeric value.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].text`	string	Text value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].textHtml`	string	Prepared HTML; preserve the supplied markup.	For each existing item; optional child fields depend on item type.
`viewModel.home.sections[].type`	string	Type value supplied for this context.	For each existing item; optional child fields depend on item type.
`viewModel.home.version`	object	Version data; check child fields before use.	When the parent is provided; check optional fields.
`viewModel.search`	object	Search data; check child fields before use.	When the parent is provided; check optional fields.
`viewModel.search.isEnabled`	boolean	Whether enabled applies; use for display only.	When the parent is provided; check optional fields.
`viewModel.wishlist`	object	Wishlist data; check child fields before use.	When the parent is provided; check optional fields.
`viewModel.wishlist.isEmpty`	boolean	Whether empty applies; use for display only.	When the parent is provided; check optional fields.
`viewModel.wishlist.itemCount`	number	Item count numeric value.	When the parent is provided; check optional fields.
`viewModel.wishlist.items`	array	Prepared items collection; may be empty.	When the parent is provided; check optional fields.
`viewModel.wishlist.productIdMap`	object	Product id map data; check child fields before use.	When the parent is provided; check optional fields.
`viewModel.wishlist.productIds`	array	Prepared product ids collection; may be empty.	When the parent is provided; check optional fields.
`viewModel.wishlist.wishlistId`	number	wishlist identifier; do not load data with it.	When the parent is provided; check optional fields.
`viewModel.wishlist.wishlistKey`	string	Wishlist key value supplied for this context.	When the parent is provided; check optional fields.

Included templates

Assets

The reference package uses its bundled theme CSS, Bootstrap and theme JavaScript. Account and checkout controls use the bundled checkout script. Partials use their caller’s resolved assets.

Example

<cfset viewModel = routeConfig.viewModel>
<cfoutput><h1>#encodeForHtml(viewModel.page.title)#</h1></cfoutput>

Use the page-specific structures above for the remaining content.

Behaviour

Use prepared URLs and labels. Encode plain text and HTML attributes; preserve only explicitly prepared HTML.

Section variants

section.type	Additional fields
hero_banner	layoutVariant (wide/compact), sliderEnabled, items[].
teaser_grid	displayVariant (grid/cards/tiles), items[].
featured_products	headline, hasHeadline, displayVariant, products[] (prepared cards).
featured_categories	headline, hasHeadline, displayVariant, categories[].
text_image	headline, hasHeadline, text, textHtml, hasTextHtml, image, button, layoutVariant.

Item text, images and buttons are conditional on hasHeadline, hasTextHtml, image.hasUrl and button.hasButton / button.hasLink. Collections can be empty.