--- title: View settings slug: experience/view-settings docTags: createdAt: 2024-09-13T14:45:51.441Z --- Consider views as distinct pages within your app – like the main homepage, a list of articles from a specific category, a detailed article page, or subscription offers. You can configure a view to display contents based on filters using different components in that view. In PXP \< 4.0, all views are set up and administered in one large views.json file, located in storefront/assets. From PXP 4.0, views are created inside a folder structure in storefront/assets/views. A pipeline is automatically run to create the large views.json from that. Views have the following fields: \* = required field | Field | Description | | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | ### name\* | Defines the class name that will be added to the DOM element "storefront-view". Therefore, we recommend using a lowercase name without spaces so it works well as a CSS selector. | | ### path\* | Describes under which URL the view will be accessible (exception: [Using the URL resolver for dynamic paths](docId\:S4eu5UBlL5qNrohm3W_wo)). **Note**: The root view must have the path `/`, all other paths must not start with a slash.
Running the split views approach, the path is taken from the path in the views folder. Refer to [View configuration](docId\:kxmX0xDffeLDjq7Z4lqLX) for details. | | ### pullToRefresh | The view will automatically be updated on any changes caused by app resumes or invalidations (e.g. caused by a login or a purchase). If 'pullToRefresh' is activated, manual updates via a pull gesture will also trigger an update. | | ### appBar | If 'appBar' is set, it shows the top app bar with the matching ID from the appBar.json | | ### navigation | If 'navigation' is set, it shows the bottom sticky navigation bar with the matching ID from the navigation.json | | ### content\* | 'content\*' defines the content of the page, composed of different possibly nested [Inspecting Components](docId\:i2NqGh5HBvmJYZw6IcHky). | | ### data | 'data' stands for a list of [Data sources](docId\:fMhCpmNdGjfGYmAhhV-nE) that are required throughout the page. You may set up data sources to be loaded per view or from the components defined above. | | | | | ### title | The \ Tag text is shown in the browser's bar and search engine entries. You can use $context, $functions or $global expressions, but it is not reactive (e.g. only set once). The \<title> Tag is relevant to be set for SEO. | | ### postView | 'postView ' is set for the simple opening of content based on 'postType'. We recommend using the URL resolver as it gives more flexibility. | | ### cache | Allows configuring the `cache-control` header by specifying maxAge, staleWhileRevalidate and staleIfError. Values are set in seconds. If none are set, defaults are used, see tooltips for the current defaults. <br />See [CloudFront docs](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Expiration.html) for more information on the `cache-control` header.<br /><br />In general, our defaults are:<br />1) The page has a max-age of 60 (1 minute), afterwards it is deemed stale. 2) We set stale-while-revalidate headers to 3600 (1 hour), so even if a page is stale, it may be served during this timeframe to the user but also trigger a new render on server-side, so that a following request then serves a new response, which was just rendered in the background. - This is mostly there for users to quickly get a working website instead of waiting 3+ seconds for a full render 3) Finally, we also serve stale-if-error with 86400 (1 day). If the server failed to render a page, CloudFront or the browser is allowed to serve a previously cached page even if it is up to 1 day old. | | ### seo | Adds metadata tags to the rendered HTML, e.g. for Open Graph properties. See [SEO view configuration](docId\:Cu7hAFS68vQ0Qcxn8vNPm) for more details. | | ### pageConfigs | Currently used for setting up traffective tracking. | | ### viewTrackingParams | Additional tracking parameters for view tracking events. | | ### jsonLD | A string representing the [JsonLD](https://json-ld.org/) config to pass additional information to Search Engine Crawlers. | | ### errorPage | If true, the page is treated as an Error Page. |