# Shop the look

**Shop the look** is where a set of products mixed and matched together. This section allows merchants to showcase complete outfits or curated product combinations, encouraging customers to easily purchase entire looks with just a few clicks.

By creating visually appealing collections, merchants can leverage the **Shop the look** section to influence customer buying decisions and enhance the overall aesthetic appeal of their online store.

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

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

1. In the theme editor (**Customize**), click **Add section**
2. Locate and custom **Shop the Look**
   {% endhint %}

## Section settings <a href="#shop-the-look-settings" id="shop-the-look-settings"></a>

### Section header and general <a href="#header" id="header"></a>

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.

Adjust the text alignment (left/center/right) along with the background color and container type.

<figure><img src="https://content.gitbook.com/content/z14kVz432NnMEq8AbqBr/blobs/6GD3n53RY979VbeREj9t/image.png" alt=""><figcaption></figcaption></figure>

**Layout:** You can choose between Fluid Container, Stretch width, Full width for the layout or just leave it with the default layout of the video.

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

<figure><img src="https://content.gitbook.com/content/z14kVz432NnMEq8AbqBr/blobs/4z4pJwKZXSB2O5XIVsDb/image.png" alt=""><figcaption></figcaption></figure>

### Lookbook settings

You can choose which image to show up as thumbnail and custom it in this setting.

**Dots type**: custom button placed in specific points on thumbnail image

**Aspect ratio**: adjust the ratio of the thumbnail image with the given choices

**Custom ratio**: adjust the ratio of the thumbnail image as you want

**Thumbnail position**: set the position of the thumbnail image relative to lookbook products

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

### Lookbook action and Product <a href="#thumbnail" id="thumbnail"></a>

**Thumbnail Position:** Adjust the placement of thumbnails to either the left or right side on desktop views, ensuring optimal layout and visual balance.

**Items Per Row:** Specify the number of items you wish to display per row, tailoring the arrangement to fit your design preferences and content needs.

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

### Settings for carousel

**Show Arrows:** Activate arrows for users to manually swipe through carousel items.

Direct Navigation via **Dot:** Utilize dots to allow users to jump directly to a specific tab or item in the carousel, enhancing navigation efficiency.

**Column gap:** Adjust the spacing between two Instagram items to ensure a visually pleasing and well-organized layout within the Instagram block.

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

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

## Blocks settings <a href="#id-2.-lookbook-items-settings" id="id-2.-lookbook-items-settings"></a>

You now have the option to select related products to promote, along with the ability to set the position of the plus sign, which represents these products, both vertically and horizontally for precise placement.

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