Pages¶

Experience builder Pages are JSON files that can be configured with components and widgets to bring data to life

Page Attributes¶

Attribute	Type	Required	Description	Default Value
`route`	object	No	Object with route instructions for the page.	-
`layout`	String	No	Name of layout page.	-
`title`	String	No	Title of the page.	-
`description`	String	No	Description of the page for visual building.	-
`metaTags`	Array(String)	No	Array of meta tags for the page.	-
`widgets`	Array(String)	No	An array of widgets names. This list must be unique.	-
`components`	Object	No	An object array that uses component IDs as keys, and component's data as values. This attribute needs to contain at least one component if there are no widgets defined. Duplicate IDs within the pages aren't allowed.	-
`order`	Array	No	An array of component IDs and/or widgets IDs, listed in the order that they should be rendered. The IDs must exist in the `components` object. Duplicates are not allowed.	-

Route Attributes¶

Note: The page level route object replaces the need to define a configuration level route. if a route with the identical path is found in both the configuration and at the page level, The page route will override the configuration route.

Attribute	Type	Required	Description	Default Value
`path`	String	Yes	Human-readable name of the route.	defaults to name of resource
`authorize`	Boolean	No	Indicates whether authorization is required.	false
`systemFunction`	String	No	System function associated with the route, if any (e.g., Login, Logout, Checkout).	-
`metaObjects`	Array(MetaObject)	No	Array of meta objects.	-
`contentType`	String	No	Specifies the content type of the response.	-
`method`	String	No	HTTP method used for the route (e.g., GET, POST).	GET
`redirectPath`	String	No	Route ID to redirect to	-

Meta Object Attributes¶

Attributes	Type	Required	Description	Default
`name`	String	Yes	Name of the meta object.	-
`sdk`	Object	No	Defines the SDK configuration for fetching data.	-

SDK Attributes¶

Attributes	Type	Required	Description	Default
`route`	String	Yes	SDK route used to fetch data.	-
`parameters`	Array(Object)	No	Array of parameters for the SDK route.	-
`method`	String	No	HTTP method for the SDK request (e.g., GET, POST).	`GET`
`useContextQueryString`	Boolean	No	Indicates if the context should be added to the query string.	`true`

SDK Parameter Attributes¶

Attributes	Type	Required	Description	Default
`name`	String	Yes	Name of the parameter.	-
`valueOrigin`	String	Yes	Origin of the parameter's value (e.g., `UrlParam`, `Setting`).	-
`required`	Boolean	No	Indicates if the parameter is required.	`false`

Example Using Components¶

index.json Uses a layout file

{
    "Layout": "main.layout",
    "components": {
        "image-banner-component-1": {
            "id": "image-banner-component",
            "enabled": true,
            "settings": [
              {
                "name": "backgroundImage",
                "value": "https://example.com/banner.jpg"
              }
            ],
            "blocks": {
                "heading-block": {
                    "type": "heading",
                    "settings": {
                        "heading": "https://example.com/banner.jpg"
                    }
                },
                "description-block": {
                    "type": "description",
                    "settings": {
                        "descriptionText": "This is a sample description peice of text"
                    }
                }
            },
            "blockOrder": [
                "heading-block",
                "description-block"
            ]
        }
    },
    "order": [
        "image-banner-component-1"
    ]
}

Example Using Widgets¶

widget-sample.json Uses a layout file

{
    "Layout": "main.layout",
    "widgets": ["spotlight-widget"],
    "order": [
      "spotlight-widget"
    ]
}

Context Pages¶

Context pages are JSON resources that inherit and override one or many features of the parent JSON pages for a particular context. A contextual page has three attributes that define the scope of this inheritance

Attribute	Type	Required	Description	Default
`parent`	String	Yes	The parent JSON page to inherit from	-
`context`	Object	Yes	An object array with the context scenarios for inheritance	-
`page`	Object	Yes	Object containing the attributes of the parent page to be overloaded	-

Currently the only context object available is market.

Attribute	Type	Required	Description	Default
`markets`	String or Array(String)	Yes	The market for the context

Single Market Example: Contextual Page index.intl.json disables the banner_component from index.json if the market scope of the page request is "international"

    {
      "parent": "index.locale",
      "context":  {
        "markets": "intl"
      },
      "page": {
          "components": {
            "banner_component": {
              "enabled": false
            }
          }
       }
    }

Multi-Market Example: Contextual Page index.multi.ctxpage disables the banner_component from index.page if the market scope of the page request is "Germany" or "France"

    {
      "parent": "index.page",
      "context":  {
        "markets": ["Ger", "Fra"]
      },
      "page": {
          "components": {
            "banner_component": {
              "enabled": false
            }
          }
       }
    }