> For the complete documentation index, see [llms.txt](https://nextsky-2.gitbook.io/milano-shopify/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://nextsky-2.gitbook.io/milano-shopify/theme-sections/featured-product.md).

# Featured product

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2F2nikVcfmYPEzR7WNUmwG%2Fimage.png?alt=media&amp;token=6f8424f6-3a19-42b2-9c78-104a4071f682" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
Steps

* In the theme editor (**Customize**), click **Add section**
* Locate **Featured product**
* **Save**
  {% endhint %}

## General settings

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FgPJMc2PetGuXRulWbGS4%2Fimage.png?alt=media&amp;token=599737a0-2cf6-4a7f-869d-669b919a5714" alt=""><figcaption></figcaption></figure>

| Setting            | Description                                                                                                                           |
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------- |
| Product            | Select the product you wish to display.                                                                                               |
| Center information | Align product information in the center                                                                                               |
| Section width      | You can choose among Fluid Container, Stretch width, Full width for the layout or just leave it with the default layout of the video. |
| Color scheme       | You are allowed to change text color, background color, etc. with preset color.                                                       |

## Media

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FI5ZRl1TDIaH34Rdi7YsU%2Fimage.png?alt=media&amp;token=d30807d5-6a18-4841-a3d6-a465db90afb3" alt=""><figcaption></figcaption></figure>

| Setting                     | Description                                          |
| --------------------------- | ---------------------------------------------------- |
| Desktop media width         | Configure the media width for desktop displays.      |
| Desktop main image position | Determine the position of the main image on desktop. |
| Desktop thumbnails position | Set the position of thumbnails on desktop.           |
| Enable video autoplay       | Configure the video to autoplay on desktop.          |
| Enable video looping        | Set the video to loop continuously after finishing.  |

## Section padding

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

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2Fzasv4yYOs0Edcx4ckLu6%2Fimage.png?alt=media&amp;token=b922a953-ff4b-49c6-8608-331c65cb3d78" alt=""><figcaption></figcaption></figure>

## Block settings

With each block added, you will have the option to relocate them and access more detailed settings.

<figure><img src="https://1163507529-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAGMtjb3mOlhr9pzqKwM0%2Fuploads%2FnZp425X56OzhAsc3WV8M%2Fimage.png?alt=media&amp;token=cf091ca5-aec0-4fc7-8115-0aef8a0a4b1f" alt=""><figcaption></figcaption></figure>
