> For the complete documentation index, see [llms.txt](https://docs.b2bridge.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.b2bridge.io/storefront-display/product-card-display.md).

# Product Card display

Product Card allows your customers to start ordering directly from your collection pages (or any pages that Product Card is displayed on).

### How Product Card works:

Product Card replaces your default interface and adds new elements:

* New B2B prices
* Volume pricing and purchase limit (if any)
* Quantity selector
* **Add to cart** button

This allows your customers to quickly add products to their cart.

### How the Product Card looks:

{% columns %}
{% column %}

<figure><img src="/files/4AfTVi7Vy1WA93Ap6QKf" alt=""><figcaption><p>B2Bridge Product Card</p></figcaption></figure>
{% endcolumn %}

{% column %}

<figure><img src="/files/AF18RCj5KQi0YozFEKTf" alt=""><figcaption><p>Default product card</p></figcaption></figure>
{% endcolumn %}
{% endcolumns %}

***

{% hint style="success" %}

### Need Help?

If you have questions or run into issues while using any feature, we’re here to help.

* 💬 **Start a** [**Live Chat** with our support team](https://go.crisp.chat/chat/embed/?website_id=a59f354c-f51f-4f84-ae9a-c0e8dd69d2e5) directly from your B2Bridge dashboard.
* 📧 **Email us at** [**support@b2bridge.io**](mailto:support@b2bridge.io) and we’ll get back to you as soon as possible.
  {% endhint %}