# Products deal

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

<figure><img src="https://content.gitbook.com/content/5WlAIkq5Keo641r70Byr/blobs/xASUz9fstYtzMH6DPT7W/Products%20deal.jpg" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Steps

1. In the theme editor (**Customize**), click **Add section**
2. Locate **Products deal**
3. **Save**
   {% endhint %}

## Products Deal Setting

#### 1. Section header and general

Use the provided text fields to add a suitable heading/subheading/description. Leave any of them blank if you do not want to display them.&#x20;

<figure><img src="https://content.gitbook.com/content/5WlAIkq5Keo641r70Byr/blobs/UaEO5DGFPbxJ6Q5bnxEJ/image.png" alt=""><figcaption></figcaption></figure>

**Layout:** You can choose between Container, Wrapped container, Full width for the banner layout.

**Color schema:** You are allowed to change text color, background color with preset color.

<figure><img src="https://content.gitbook.com/content/5WlAIkq5Keo641r70Byr/blobs/r2P8kA6Kfr2ZL4SgnCc0/image.png" alt=""><figcaption></figcaption></figure>

#### 2. Super Deal content

* Choose the end time
* Text content

<figure><img src="https://content.gitbook.com/content/5WlAIkq5Keo641r70Byr/blobs/L2MVQpcIZuqpqAVPL5s4/image.png" alt=""><figcaption></figcaption></figure>

#### 3. Products settings

Specify the quantity of products to display, the number of products per row, and the gap between two adjacent products.

You have the flexibility to enable **Autoplay** for automatic carousel scrolling and **Infinity** for continuous looping. Additionally, you can navigate through pagination or use **Show arrows** and **Dots** for navigation.

<figure><img src="https://content.gitbook.com/content/5WlAIkq5Keo641r70Byr/blobs/sUvlmoS3iHtl1GlFCqLW/image.png" alt=""><figcaption></figcaption></figure>

#### 4. Banner settings

Choose to add a small image or video that will be on the left or right side of the product

<figure><img src="https://content.gitbook.com/content/5WlAIkq5Keo641r70Byr/blobs/trlztlhX4cxAQUS8pMli/banner-setting.jpg" alt=""><figcaption></figcaption></figure>

**Add focal point:** This feature helps you select the most important part of an image for your store. It ensures that the focal points of the image always remain visible, even if a section crops the image to fit the layout.

<div><figure><img src="https://2521394731-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5WlAIkq5Keo641r70Byr%2Fuploads%2FjYcM20dceNDbVusyWVpo%2FScreenshot%202023-12-19%20120220.png?alt=media&#x26;token=471137ca-13eb-468e-b20a-8563a3699223" alt=""><figcaption></figcaption></figure> <figure><img src="https://2521394731-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5WlAIkq5Keo641r70Byr%2Fuploads%2F72U7oFwfcp8dT2NaJxcs%2FScreenshot%202023-12-19%20140615.png?alt=media&#x26;token=656cbb71-4fe3-4838-9160-6e24be350e41" alt=""><figcaption></figcaption></figure></div>

{% hint style="info" %}
Please follow this [link](https://help.shopify.com/en/manual/online-store/images/theme-images) for more information.
{% endhint %}

#### 5. Section padding

Section padding allows you to specify the space between the slideshow and the preceding or following sections, or both.

<figure><img src="https://content.gitbook.com/content/5WlAIkq5Keo641r70Byr/blobs/iy7mgPOp5IMHZfDIyPg7/image.png" alt=""><figcaption></figcaption></figure>
