Experience Pages Configuration

Info: Experience Pages are available starting with brXM 14.3.0.

Overview

To use Experience Pages in a Bloomreach Content implementation, configure the following:

Define at least one document type.
Create at least one Experience Page Folder.
Define at least one Experience Page Layout.

With these elements configured, CMS users can create Experience Page Documents by selecting a document type, choosing an Experience Page Layout, and storing the document in an Experience Page Folder.

Note: For step-by-step instructions, see the Configure Experience Pages tutorial.

Required Configuration

Document Type

You can use any regular document type to create an Experience Page. However, for most scenarios, define a dedicated document type specifically for Experience Pages. This document type typically contains only page metadata. The page's content is rendered by catalog components added by CMS users. Adjust this approach as needed for your project requirements.

Experience Page Folder

At the JCR level, an Experience Page Folder is a standard content folder with two additional elements:

The hippostd:xpagefolder mixin marks the folder as an Experience Page Folder.
The hippostd:channelid property links the folder to a specific channel. Its value must match the node name of the hst:configuration for that channel (for example, /hst:myproject/hst:configurations/myproject).

Optionally, add the hippostd:cmxpagefolder mixin to designate the folder as the default Experience Page Folder when creating new Experience Pages in the Experience manager. This option is available from version 14.4.0.

To configure an Experience Page Folder, create a regular content folder using the CMS UI, then add the required mixin(s) and property in the Console.

Example YAML configuration for an Experience Page Folder:

/content/documents/myproject/experience-pages:
  jcr:primaryType: hippostd:folder
  jcr:mixinTypes: ['hippo:named', 'hippostd:cmxpagefolder', 'hippostd:xpagefolder',
    'hippotranslation:translated', 'mix:versionable']
  hippo:name: experience pages
  hippostd:channelid: myproject
  hippostd:foldertype: [new-translated-folder, new-document]
  hippotranslation:id: 6b47d18b-1428-4c88-ac38-07b923480d35
  hippotranslation:locale: en

When a CMS user creates a new Experience Page in a channel using the Experience manager, the New page side-panel uses the folder configuration as follows:

The Page location field is set to the first subfolder of the channel's content root folder that meets all three conditions:
- Contains the hippostd:xpagefolder mixin.
- Contains the hippostd:cmxpagefolder mixin.
- Has a hippostd:channelid property matching the current channel's name.
If no folder contains the hippostd:cmxpagefolder mixin, the first subfolder with the other two conditions is selected.
The Page type dropdown is populated using the template query referenced by the first value in the folder's hippostd:foldertype property that ends with "-document".

Info: The hippostd:cmxpagefolder mixin and support for nested subfolders as Experience Page Folders are available from brXM 14.4.0.

If you use version 14.3, do not add the hippostd:cmxpagefolder mixin. Use only direct child folders of the channel's content root folder until you upgrade to 14.4.

Experience Page Layouts

Define Experience Page Layouts in the site's HST configuration under the hst:xpages node (for example, /hst:myproject/hst:configurations/myproject/hst:xpages).

At the JCR level, an Experience Page Layout is a node of type hst:xpage, which inherits from the hst:component node type. Key properties include:

The hst:xpage node's hst:label property, which sets the UI label shown to CMS users when selecting a layout for a new Experience Page.
Any hst:containercomponent node created within the Experience Page Layout configuration automatically receives a hippo:identifier property with a generated UUID. This identifier allows Experience Page Documents to reference a specific container in the corresponding Experience Page Layout.

Example YAML configuration:

/hst:myproject/hst:configurations/myproject/hst:xpages:
  jcr:primaryType: hst:xpages
  /experience-page:
    jcr:primaryType: hst:xpage
    hst:label: Experience Page
    hst:referencecomponent: hst:abstractpages/base
    /main:
      jcr:primaryType: hst:containercomponent
      hippo:identifier: 426f817d-200c-4298-8500-57fd704c37fa
      hst:xtype: HST.vBox
      /content:
        jcr:primaryType: hst:containeritemcomponent
        hst:componentclassname: org.onehippo.cms7.essentials.components.EssentialsContentComponent
        hst:label: Content
        hst:template: contentpage-main

Info: For detailed configuration options, see Experience Page Layouts Configuration.

Sitemap Items

Define URLs for Experience Pages in the sitemap as you would for other pages. Because an Experience Page is self-contained and includes its own page component configuration, do not set the hst:componentconfigurationid property on the sitemap item for an Experience Page.

Example YAML configuration:

/hst:myproject/hst:configurations/myproject/hst:sitemap/experiencepages:
  jcr:primaryType: hst:sitemapitem
  hst:hiddeninchannelmanager: true
  hst:relativecontentpath: experience-pages
  /_any_.html:
    jcr:primaryType: hst:sitemapitem
    hst:relativecontentpath: ${parent}/${1}

In this example, the parent experiencepages sitemap item is hidden in the Experience manager's sitemap using the hst:hiddeninchannelmanager property. This is optional.

Note: While it is recommended to store only Experience Page Documents in an Experience Page Folder, you can technically store regular documents as well. To support this, you may add an hst:componentconfigurationid property to the _any_.html sitemap item. This property is ignored for Experience Page Documents but used as a fallback for regular documents.

Node Structure of User-Created Instances

Experience Page Document

After completing the required configuration, CMS users can create Experience Page Document instances in either the Experience manager or the Content application.

At the JCR level, an Experience Page Document node structure closely resembles that of a regular document. The key difference is that the preview and live variants include an hst:xpage child node, which defines the page configuration:

The page configuration is an instance of an Experience Page Layout, specified by the hst:pageref property. The value of this property matches the node name of the Experience Page Layout definition.
Each hst:containercomponent within the page configuration has a randomly generated node name and a hippo:identifier property. This identifier links the container to the corresponding container in the Experience Page Layout definition, allowing for stability if the layout is modified.

Example YAML configuration:

/content/documents/myproject/experience-pages/my-experience-page/my-experience-page[3]:
  jcr:primaryType: myproject:contentdocument
  jcr:mixinTypes: ['hst:xpagemixin', 'mix:referenceable']
  hippo:availability: [live]
  hippo:related___pathreference: []
  hippostd:retainable: false
  hippostd:state: published
  hippostdpubwf:createdBy: admin
  hippostdpubwf:creationDate: 2020-09-03T14:35:10.391-07:00
  hippostdpubwf:lastModificationDate: 2020-09-03T14:35:18.748-07:00
  hippostdpubwf:lastModifiedBy: admin
  hippostdpubwf:publicationDate: 2020-09-03T14:35:22.426-07:00
  hippotranslation:id: ddc64667-6597-464f-97f4-5ae46039da15
  hippotranslation:locale: en
  myproject:introduction: intro
  myproject:publicationdate: 2020-09-03T14:35:00-07:00
  myproject:title: My Experience Page
  /myproject:content:
    jcr:primaryType: hippostd:html
    hippostd:content: <p>content</p>
  /hst:xpage:
    jcr:primaryType: hst:xpage
    hst:pageref: experience-page
    /426f817d-200c-4298-8500-57fd704c37fa:
      jcr:primaryType: hst:containercomponent
      hippo:identifier: 516ce5d4-33ed-42b9-aa76-361e2b60d4a2
      /content:
        jcr:primaryType: hst:containeritemcomponent
        hst:componentclassname: org.onehippo.cms7.essentials.components.EssentialsContentComponent
        hst:label: Content
        hst:template: contentpage-main

Optional: Hide Experience Pages in the Experience Manager's Sitemap

By default, Experience Pages appear in the Sitemap within the Experience manager. If your project contains a large number of Experience Pages and you want to hide them from the sitemap, add the following property to your implementation project's HST configuration properties:

channelmanager.sitemap.hide.xpages = true

Optional: Enable Page Campaigns

Info: Page campaigns are available starting with brXM 14.6.0.

The page campaigns feature is disabled by default.

To enable page campaigns:

Log in to the Console.
Navigate to /hippo:configuration/hippo:modules/channel-content-service/hippo:moduleconfig.
Set the page.campaign.supported property to true.
Save your changes to the repository.

Alternatively, you can add the following YAML to the bootstrap data for your project's CMS web application:

definitions:
  config:
    /hippo:configuration/hippo:modules/channel-content-service/hippo:moduleconfig:
      page.campaign.supported: true

If your implementation uses a custom SPA integration (not the SPA SDK), ensure your frontend application passes the br_version_uuid request parameter to the Delivery API. For more information, see SPA Troubleshooting.