# How to setup Product Cards Scrolling Tags & Custom Badges

* [Product Cards Scrolling Tags](#id-1.-setting-up-product-cards-scrolling-tags)
* [Custom Badges](#id-2.-setting-up-custom-badges)

{% embed url="<https://youtu.be/3ljh-lw08ts>" %}

[**Product** **Cards** **Scrolling Tags:** ](#id-1.-setting-up-product-cards-scrolling-tags)These are dynamic, horizontal tags that scroll across your product card typically used to highlight  important information such as seasonal promotions, bestsellers, new arrivals, or specific product features. They improve the browsing experience by providing a visually engaging way to navigate through different categories or product highlights

<figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2FMGMtSUYXQQS9e6UmkSTd%2FScreenshot%202024-08-07%20at%2020.38.59.jpg?alt=media&#x26;token=edc4f10c-2d8d-452b-83a2-14c5b7b2ee7a" alt="" width="375"><figcaption></figcaption></figure>

[Custom Badges:](#id-2.-setting-up-custom-badges) These are customizable labels or icons that can be added to product images or listings to draw attention to specific attributes, such as “New Arrival,” “Best Seller,” or “Limited Edition.” They help communicate important information at a glance and enhance the visual appeal of your products.

<figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2FEVjLILNADUV52ikkex7L%2FScreenshot%202024-08-07%20at%2020.43.40.jpg?alt=media&#x26;token=821bfa5a-ed50-4c8f-902e-ef94a979ee53" alt="" width="254"><figcaption></figcaption></figure>

## **1. Setting up Product Cards Scrolling Tags**

**Step 1: Log in to your Shopify Admin**

* Go to your Shopify **Admin** dashboard.
* Go to your online store.

**Step 2: Customize**

* Click the "**Customize**" button next to the theme.

**Step 3: Theme Settings**

* Go to "**Theme Settings**"
* Scroll down and click on "**Product cards**"&#x20;

<figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2FewVqNBUV270qmw9ZqIqM%2FScreenshot%202024-08-07%20at%2017.08.22.png?alt=media&#x26;token=22016544-3781-4d89-a262-e88ba5ba0f57" alt=""><figcaption></figcaption></figure>

<figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2F0Nxe0DyEtcoEl89SJxHm%2Fadmin.shopify.com_store_elysian-ease_themes_171665817947_editor_category%3Dgid%253A%252F%252Fshopify%252FOnlineStoreThemeSettingsCategory%252FProduct%252Bcards%253Ftheme_id%253D171665817947%2526first_setting_id%253Dcard_style%26context%3Dtheme.png?alt=media&#x26;token=f8e8d784-3543-4782-858a-6981cbc2d258" alt=""><figcaption><p>Product Cards Scrolling Tags</p></figcaption></figure>

**Step 4: Add tags to a product**

* From your Shopify admin, go to "**Products**"&#x20;

<figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2FIBEvoltReEC0dJfa72Ya%2FScreenshot%202024-08-07%20at%2017.26.50.png?alt=media&#x26;token=4516b7ed-3508-4f82-8dfa-ba90aa37010a" alt=""><figcaption></figcaption></figure>

* Click the name of a product to edit.
* In the "**Product organization**" section, select or enter tags for your product. Use a comma to separate different tags. Tags can have up to 255 characters.
* When you are finished, click **Save**.&#x20;
* Once saved, reload your store page.<br>

{% hint style="info" %}
Note: if you can't see the scrolling tag you just added, try to reload the page again.
{% endhint %}

Once done, do the same thing with the other products.

<div align="left"><figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2FxpnPRM05ksCiqcpXowGP%2FScreenshot%202024-08-07%20at%2018.10.11.png?alt=media&#x26;token=ad9346ad-bdda-4825-a438-97c0b0123c27" alt=""><figcaption></figcaption></figure> <figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2Fn5DLzW4b9dTvd1MWv90Z%2FScreenshot%202024-08-07%20at%2018.10.20.png?alt=media&#x26;token=6d333646-fd76-4a99-92b3-1506bfe2df27" alt=""><figcaption></figcaption></figure></div>

**You can change the tags speed, the color of the text, the background, the size, the style, the border and the shadow.**

## **2. Setting up Custom Badges**

{% embed url="<https://youtu.be/3ljh-lw08ts>" %}

* **Step 1: Log in to your Shopify Admin**
* Go to your Shopify **Admin** dashboard.
* Go to your online store.

**Step 2: Customize**

* Click the "**Customize**" button next to the theme.

**Step 3: Add badges to a product**

* From your Shopify admin, go to "**Products**"&#x20;
* Click the name of a product to edit.
* In the "**Product organization**" section, go to "**Tags**".
* Write "**Badge1:**". For example you can write "**Badge1:Best Seller**".

<figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2Fjn78k0mc29dHcXBkY4pQ%2FScreenshot%202024-08-07%20at%2018.59.50.png?alt=media&#x26;token=5d4121e2-4c2e-4591-90fa-cf1eefaa4a79" alt="" width="336"><figcaption></figcaption></figure>

* When you are finished, click **Save**.&#x20;
* Once saved, reload your store page.<br>

{% hint style="info" %}
Note: if you can't see the custom badge you just added, try to reload the page again.
{% endhint %}

<figure><img src="https://16317214-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F7B3IJeztKkmI6RdD8j2l%2Fuploads%2FIQY0yYOWVU94B7NoL4r3%2Fadmin.shopify.com_store_elysian-ease_themes_171665817947_editor_context%3Dtheme%26category%3Dgid%253A%252F%252Fshopify%252FOnlineStoreThemeSettingsCategory%252FBadges%253Ftheme_id%253D171665817947%2526first_setting_id%253Dbadge_type.png?alt=media&#x26;token=d49c44e8-de9a-402d-9b61-a74c0a9e2597" alt=""><figcaption><p>Custom Badges</p></figcaption></figure>

**Step 4: Change colors**

* You can change the color of the text and the background by going to "**Theme settings**".
* Then clicking on "**Badges**".