> For the complete documentation index, see [llms.txt](https://docs.roadmap.so/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.roadmap.so/trade-and-b2b/overview-of-trade-dashboard/customize-how-products-display-on-the-trade-dashboard.md).

# Customize how products display on the Trade Dashboard

Control terminology, image size, products per page, the compare-at price, the variant button text, and the product subtitle on the Trade Dashboard.

Control the wording and product details customers see on the Trade Dashboard.

Use **Display** to set terminology, image size, paging, compare-at pricing, the variant button text, and the product subtitle.

#### What these settings control

Use **Display** to control:

* whether customers see `Quote` or `Draft order` language
* how large product images appear
* how many products load per page
* whether compare-at pricing appears
* the text on the variant selector button
* which subtitle shows under each product title

#### Open Display settings

{% stepper %}
{% step %}

#### Open Trade Dashboard settings

In the Roadmap app, go to **Settings → Trade Settings → Trade Dashboard**.
{% endstep %}
{% endstepper %}

{% hint style="info" %}
The **Trade Dashboard** tab's sections run top to bottom: **Header & tabs**, **Display**, **Pre-order & back-order**, **Filters**, **Quote builder**, then **Access**. This guide covers **Display**.
{% endhint %}

<figure><img src="https://393112916-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJ8asLD4FVCFagK40xEr4%2Fuploads%2FHfllxQKvt4Qns4AR6jG0%2FScreenshot%202026-09-07%20at%203.01.18%E2%80%AFPM.png?alt=media&amp;token=4c08137a-2f1a-4295-9eea-23a5f47337ae" alt="Display settings"><figcaption><p>The Display settings in the Roadmap app.</p></figcaption></figure>

#### Choose the terminology

Use **Terminology** to decide whether the dashboard refers to an order as a `Quote` or a `Draft order`.

Choose the term that matches how your team talks to trade customers.

#### Set the image size

Use **Image size** to control how large product images appear in the list.

* **Compact** — smaller images and more products in view
* **Comfortable** — larger images and easier scanning

#### Set products per page

Use **Products per page** to control how many products load on each page.

Enter a value between `5` and `200`.

The default is `50`.

Use a lower number for easier scanning on smaller screens.

#### Show the compare-at price

Turn on **Show compare-at price** to display the original price beside the trade price when a product has a discount or sale price.

In most setups this is the product's compare-at price. If the customer is on a catalog, it reflects that catalog's pricing context.

Use **Compare-at price prefix** to set the text shown before that price.

For example, use `RRP`.

<figure><img src="https://393112916-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJ8asLD4FVCFagK40xEr4%2Fuploads%2FhYuGnEXOy77jB0qCyNzA%2FScreenshot%202026-09-07%20at%203.10.53%E2%80%AFPM.png?alt=media&amp;token=a6f8bdb8-bc95-4601-b08b-7d72094994f1" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Leave the prefix empty to fall back to `RRP`.

To hide the label entirely, enter a single space.
{% endhint %}

#### Set the variant button text

Use **Variant button text** to change the button shown on products with more than one variant.

The default is `Configure`; use your own wording, for example `Select` or `Show variants`.

The button still says `Hide` while the variant selector is open.

<figure><img src="https://393112916-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJ8asLD4FVCFagK40xEr4%2Fuploads%2FNyG4BsdveRvVUV5gcbMM%2FScreenshot%202026-09-07%20at%203.13.47%E2%80%AFPM.png?alt=media&amp;token=6f3ee409-916b-4614-a22a-d79ff07e6e7e" alt=""><figcaption></figcaption></figure>

#### Set the product subtitle

Use **Product subtitle template** to control the line of text shown under each product title.

You can build the template with these variables:

* `{{vendor}}`
* `{{collections}}`
* `{{first_collection}}`
* `{{product_type}}`
* `{{catalog}}`
* `{{metafield:namespace.key}}`

Only text-type product metafields are supported.

Leave the template blank to hide the subtitle.

For example, `{{catalog}}` shows the product's catalog name under the title.

<figure><img src="https://393112916-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJ8asLD4FVCFagK40xEr4%2Fuploads%2FIYqcCcQhh11Luvqa1kc1%2FScreenshot%202026-09-07%20at%203.09.15%E2%80%AFPM.png?alt=media&amp;token=c6f37118-3605-4e82-bd7d-bedbd2f793da" alt=""><figcaption></figcaption></figure>

#### Troubleshooting

**The subtitle does not show**

* Check whether **Product subtitle template** is blank.
* If you use `{{metafield:namespace.key}}`, make sure the metafield is text-type.

**The compare-at label still shows `RRP`**

* Leaving the prefix blank uses `RRP`.
* Enter a single space if you want to hide the label entirely.

#### Frequently asked questions

<details>

<summary>Can I use my own product metafield in the subtitle?</summary>

Yes. Use \`{{metafield:namespace.key}}\`. The metafield must be a text-type product metafield.

</details>

#### Related guides

* [Overview of the Trade Dashboard](/trade-and-b2b/overview-of-trade-dashboard.md)
* [Set the Trade Portal header, titles & tabs](/trade-and-b2b/overview-of-trade-dashboard/set-the-trade-portal-header-titles-and-tabs.md)
* [Show pre-order and back-order info on Trade quotes](/trade-and-b2b/overview-of-trade-dashboard/show-pre-order-and-back-order-info-on-trade-quotes.md)
* [Configure Trade Dashboard access and quote builder](/trade-and-b2b/overview-of-trade-dashboard/configure-trade-dashboard-access-and-quote-builder.md)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.roadmap.so/trade-and-b2b/overview-of-trade-dashboard/customize-how-products-display-on-the-trade-dashboard.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.