---
title: Publications in views.json
slug: experience/publications-in-viewsjson
description: In this article, you learn how to create a list to display two or more publications in your Purple Experience for App and/or Web. The steps will be proceeded in the views.json in Purple Experience Builder.
docTags: 
createdAt: 2022-10-11T13:27:26.000Z
---

Purple Experience

***

## Summary

In this article, you learn how to create a list to display two or more publications in your Purple Experience for App and/or Web. The steps will be proceeded in the views.json in Purple Experience Builder.

***

## Preconditions

- Have at least two Publications created in Purple Manager
- Have images added to your publications
- Have your publications published in the Public Database

Read this article to learn, how to [Create a publication in Purple Manager](docId\:TMgmkHSfuemSh8aX65x0B).

***

## How-to guide

1\. Go to Experience Builder, choose your app from the list and click on it

![choose your app from the list and click on it](https://images.tango.us/workflows/4cb6b3e3-bc33-426b-a6ba-d235148a2d55/steps/05808e21-06a1-49f9-8dfc-7d52de505e91/26c2179b-4e0b-4c0f-8870-ca96e3bea33c.png?crop=focalpoint\&fit=crop\&fp-x=0.5000\&fp-y=0.5000\&fp-z=1.0000\&w=1200\&ar=2880%3A884)

2\. Click on 'Pull from preview'

::Image[]{src="https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/1Dyut97ZVt4OfcGKBk1Pq_grafik.png" size="70" width="1518" height="658" position="center" alt="Click on 'Pull from preview'" showCaption="false"}

3\. Click on 'default'

![Click on 'default'](https://images.tango.us/workflows/4cb6b3e3-bc33-426b-a6ba-d235148a2d55/steps/ea617c3c-35de-4ad8-801c-d16576b49319/9e963a57-7866-4cbb-b9ef-a345297b6247.png?crop=focalpoint\&fit=crop\&fp-x=0.5000\&fp-y=0.5000\&fp-z=1.0000\&w=1200\&ar=2246%3A1128)

4\. Click on 'storefront'

![Click on 'storefront'](https://images.tango.us/workflows/4cb6b3e3-bc33-426b-a6ba-d235148a2d55/steps/8fac89fa-47a7-4f81-af06-5624e30c6672/6933da7d-46c0-4ba7-98b1-b232374481d1.png?crop=focalpoint\&fit=crop\&fp-x=0.5000\&fp-y=0.5000\&fp-z=1.0000\&w=1200\&ar=2330%3A1308)

5\. Click on 'assets'

![Click on 'assets'](https://images.tango.us/workflows/4cb6b3e3-bc33-426b-a6ba-d235148a2d55/steps/fc31528d-0250-4534-a7bc-1bf494263bc4/0d40e62b-c9fe-4d38-abd9-a1510196ddda.png?crop=focalpoint\&fit=crop\&fp-x=0.5000\&fp-y=0.5000\&fp-z=1.0000\&w=1200\&ar=2335%3A1312)

6\. Click on 'views.json'

::Image[]{src="https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/lm33yRywRQoujuWIhV1Y0_0c0abaa8-d883-462a-bc96-f3a15b04b7db.png" size="48" width="822" height="1655" position="center" alt="Click on 'views.json'" showCaption="false"}

7\. Click on the '+' button



![Click on the '+' button](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/gyL1iqxKcgP_pbE6i91KN_image.png)

8\. Enter a name and path name.

![Enter a name and path name.](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/NwpCDihkP1LX9ii9yiPc8_image.png)

9\. Click on the '+' button

![Click on the '+' button](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/YDBGOhO10VQxAmPjMIMk8_image.png)

10\. Click on the dropdown and change it to 'List'

![Click on the dropdown and change it to 'List'](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/nBnfMOsAZIAMNC2FsH3wI_image.png)

11\. Click on the pen icon

![Click on the pen icon](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/tA1tRcLs70m0m3FgoN8y3_image.png)

12\. Copy and paste the following code into the field

```json
{
  "content": {
    "type": "publication"
  },
  "dataSource": {
    "type": "publication",
    "filter": {
      "properties": {
        "key": "channel",
        "value": "true",
        "negated": true
      }
    }
  },
  "type": "list",
  "template": "horizontal",
  "centered": true,
  "selection": {
    "param": "publication",
    "init": true
  },
  "class": "publication-list  "
}
```

13\. Press the save button

![Press the save button](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/moi9rRZlGSREPhc_wK7ec_image.png)

14\. Click on the burger menu

::Image[]{src="https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/qWxlWrBhgXXKXt7tjdLud_image.png" size="70" width="2764" height="1350" position="center" alt="Click on the burger menu" showCaption="false"}

15\. Click on 'Update Dynamic Ressources'

::Image[]{src="https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/wyJ6buUvftsr9gIe3xn2Y_image.png" size="70" width="1192" height="510" position="center" alt="Click on 'Update Dynamic Ressources'" showCaption="false"}

16\. Save your changes and name them, e.g. 'publication\_view'

![Save your changes and name them](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/xYlUzInkBw_ulnhkf4qw__image.png)

17\. Click on 'Merge all files to preview'

![Click on 'Merge all files to preview'](https://api.archbee.com/api/optimize/ygR6KtT9QI_R0u3uKTJsm/iz49aFDnSLc1IDezaVevp_image.png)

***

:::hint{type="success"}
You have successfully created a list to display multiple publications in the Experience HTML of your app, merged the changes and updated the dynamic resources. You can test the results in the preview and push them live if they look fine, to make them visible in your live app.
:::