# Scrolling promotion

<figure><img src="/files/pch8XM6vjbQrD5FHmXPc" alt=""><figcaption></figcaption></figure>

A scrolling promotion section lets you display an eye-catching auto-scroll row of logos or images.

You will find it helpful in showcasing your promotions, brand lists, featured products, or any trust-boosting information.&#x20;

In this article, we will show you how to add a Scrolling promotion section.

## How to add a Scrolling promotion section to your Shopify store

{% hint style="success" %}
Steps:

1. In the theme editor (**Customize**),> click **Add section.**
2. Select **Scrolling promotion.**
3. Make necessary changes.
4. **Save** the setting&#x73;**.**
   {% endhint %}

## How to edit a Scrolling promotion section <a href="#section-settings" id="section-settings"></a>

### Section settings <a href="#section-settings" id="section-settings"></a>

#### Settings

This is where you can update scroll direction, pause scroll on hover, and adjust scroll speed, item gap on desktop, and item gap on mobile.

* **Vertical alignment**: Set how the text is aligned - Top/Middle/Bottom
* **Direct:** The scroll direction of the section - from left to right or vice versa.
* **Pause scroll on hover**: When hovering over the section, the scrolling stops.
* **Show divider between items**: Add borders between the section's blocks.

<figure><img src="/files/SCmXqKyYRJSp4ftGGcAW" alt=""><figcaption></figcaption></figure>

* **Speed**: The speed of the section when scrolling (0.1x to 3x).
* **Horizontal spacing**: The spacing between items in a section.
* **Vertical spacing**: The padding between the items and the section's container.

<figure><img src="/files/nKlOyjYiVIi8ICD3aefx" alt=""><figcaption></figcaption></figure>

### Block settings

There are three block types can be added to this section:&#x20;

* Image
* Text
* HTML
* Collection

#### Image&#x20;

Add an **Image** to promote your vendor, brand, featured products, etc.

Adjust the **Image height** on the desktop between 20px and 400px.

Select the **Image rounded** checkbox if you want the image to have rounded borders.

Then, provide the image with a specific **Link** to the desired page where you want to direct customers when they click it.

<figure><img src="/files/kZs7rsHY7aE4HCrHuPB5" alt=""><figcaption></figcaption></figure>

Additionally, you can change the **Image height** on the mobile device from 20px to 200px.

<figure><img src="/files/7zKi8T0sryBXShhKm49p" alt=""><figcaption></figcaption></figure>

#### Text&#x20;

You can use a **Text** block to display introductory text or any content you'd like to present.

Provide the text with a specific **Link** to the desired page where you want to direct customers when they click it.

This Text block allows you to adjust the **Text size**, **Font weight**, **Font style**, **Letter spacing**, **Opacity,** and **Text style.**

<figure><img src="/files/VRjO5PrTdl4EtT7xFHXF" alt=""><figcaption></figcaption></figure>

Moreover, if you are not into the text color of the section color scheme, you can enable the **Use custom color** checkbox and change the **Custom color** for the text.

<figure><img src="/files/vwMVeWuWq1SvcdHANfSL" alt=""><figcaption></figcaption></figure>

#### HTML

You can add your own custom **HTML** to customize the section.

<figure><img src="/files/368UY73kKx2Z0dMlTugF" alt=""><figcaption></figcaption></figure>

#### Collection

Add a preferable or unique **Collection** that you want to display on the Scrolling promotion and give this collection a **Title.**

* If you want to use the collection name, leave the **Title** field blan&#x6B;**.**

You can choose a featured **Image for** the collection.

* If you want to use the collection image, leave the **Image** field blan&#x6B;**.**

Change the **Title size**  to:

* Heading xs
* Heading sm
* Heading md
* Heading lg
* Heading xl
* Heading 2xl
* Display md
* Display lg
* Display xl

<figure><img src="/files/POfYFW772QN1BqY5yPlQ" alt=""><figcaption></figcaption></figure>

In addition, you can enable the **Use custom width** checkbox to adjust the **Desktop width** (200px - 800px) and **Mobile width** (250px - 500px) of the collection block if you prefer not to use the default width.

<figure><img src="/files/2OcYpGnx7RvpUySs2vWo" alt=""><figcaption></figcaption></figure>

## FAQs

### Can I hide the product count from the collection card?

In your theme editor (**Customize**), go to **Theme settings > Collection cards**, then disable the **Show product count** checkbox.

{% hint style="warning" %}
This setting will hide the product count of all collection cards on your website.
{% endhint %}

<figure><img src="/files/A28vOk9ogWeVtXzoP4ds" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: 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:

```
GET https://docs.foxecom.com/sleek-theme/theme-sections/scrolling-promotion.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
