# Scrolling promotion

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2Fps3F4twpiQnBL4lW0Fsv%2Fani2.gif?alt=media&#x26;token=66fad920-6ea6-47e8-83e9-153429b8f44c" 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="https://content.gitbook.com/content/AJrvmfqcj9TMoPkl3bNc/blobs/RGu9IwN7ruJfrx8LEHBb/image.png" 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="https://content.gitbook.com/content/AJrvmfqcj9TMoPkl3bNc/blobs/qXVOYoCpNJlXKvQa70QR/image.png" alt=""><figcaption></figcaption></figure>

### Block settings

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

* Image
* Text

#### 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="https://content.gitbook.com/content/AJrvmfqcj9TMoPkl3bNc/blobs/ecTQV8GevMJdvVOLo4aQ/image.png" alt=""><figcaption></figcaption></figure>

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

<figure><img src="https://content.gitbook.com/content/AJrvmfqcj9TMoPkl3bNc/blobs/QSWHHl1V8MDQ8omBqVnv/image.png" alt=""><figcaption></figcaption></figure>

#### Text

Add a text, link the text and adjust how it show on the section.

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FxYdI6mssEge2vUOGNMoh%2Fimage.png?alt=media&#x26;token=c58fbac6-d01c-4fda-a289-897048a66968" alt=""><figcaption></figcaption></figure>

***

<figure><img src="https://3026705042-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAJrvmfqcj9TMoPkl3bNc%2Fuploads%2FkUIzEsJKOeRiz891zyf5%2Flivechat883x471%20(1).png?alt=media&#x26;token=90cbed2c-e791-49c8-9f43-49a08bed6f1f" alt=""><figcaption><p><a href="https://apps.shopify.com/xflow?utm_source=foxecom&#x26;utm_medium=help_center_hyper&#x26;utm_campaign=banner">Install XFlow Back In Stock Automation FREE</a></p></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/hyper-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.
