> For the complete documentation index, see [llms.txt](https://help.wotnot.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.wotnot.io/build/action-blocks/catalogue.md).

# Catalogue

{% hint style="info" %}
Available on **WHATSAPP** channel for all plans
{% endhint %}

Using Catalogue, you can display a list of products that users can browse, select, and add to their cart for a seamless shopping experience.

<figure><img src="https://360969599-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsrMxU8nO3RjusUiYuXBB%2Fuploads%2FIjvbhIbYpZluIEZnnG3Z%2Fcatalogue.png?alt=media&amp;token=602b705e-4cac-4342-ad72-5bacfadccda7" alt=""><figcaption></figcaption></figure>

## Configuring the action block

Below are the configurations to setup the Catalogue as per your business use case.

<figure><img src="https://360969599-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsrMxU8nO3RjusUiYuXBB%2Fuploads%2F2KtK4t79et0mg997dLNN%2FCleanShot%202025-12-29%20at%2011.54.47.png?alt=media&amp;token=a6dda67d-f17d-4ac4-baa7-c66c1007aebf" alt=""><figcaption></figcaption></figure>

### Catalogue type

Depending on how many products you wish to show to users, choose an option:

* **Entire catalogue** - displays all your products.
* **Single product** - displays only one product.
* **Multi product** - displays the list of selected products.

### Catalogue ID

To use the Catalogue on WhatsApp, first you need to create a Catalogue on your Meta business manager. Once you upload the list of all your products on Meta business manager, use your Catalogue ID here to reference it.

[Learn how to create a catalogue](https://en-gb.facebook.com/business/help/1275400645914358?id=725943027795860)

### Product ID

Enter the list product IDs that you want to display in the catalogue.

You can list various products into sections using 'Multi product' catalogue type.

### Content

Write the header, body and footer text which will be displayed to prompt the user to open and view your catalogue.&#x20;

### Variable

Once the user adds products to the cart and checks out, the entire cart will be stored in this variable in a JSON format.&#x20;

Here is the sample JSON payload which will be stored in the provided variable,

{% code fullWidth="false" %}

```json
{
  "product_items": [
    {"product_retailer_id": "331100", "quantity": 1, "item_price": 195, "currency": "INR"},
    {"product_retailer_id": "112233", "quantity": 1, "item_price": 60, "currency": "INR"}
  ],
  "catalog_id": "712073530499979",
  "text": ""
}
```

{% endcode %}

You can then parse this JSON response and create a order in your order management system or generate a payment link to collect payment and confirm the order.

E.g. above JSON response is stored in a "purchased\_products" variable, then following Javascript can be used to parse the JSON response,

```javascript
var purchased_products = #purchased_products#;

let totalAmount = 0;

purchased_products.product_items.forEach(item => {
  totalAmount += item.item_price * item.quantity;
});

wn.setConversationVariable("amount", totalAmount); // "amount" is a conversation type variable
```

## Restrictions

* Max products that can added to a catalogue - 500
* Max products that can be displayed at a time - 30
* Max products under a section - 30
* Max sections in a catalogue - 10