# Shop the look

***

The **Shop the look** section allows you to showcase a styled image with interactive hotspots that link directly to products. This creates a highly engaging shopping experience where customers can explore and purchase items directly from a visual “look”.

### 1. Our guide to set up a Shop the look section:

{% hint style="info" %}
**Steps:**

* In the theme editor, click **Add section.**
* Locate **Shop the look.**
* Click **Save.**
  {% endhint %}

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

### 2. **Section settings**

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

* **Color scheme:** Applies colors to the section background, text, and buttons for a cohesive look.
* **Heading:** Add a title for the section (e.g., *Shop the look*).
* **Heading size:** Adjust the size of the heading.
* **Desktop layout:** Controls whether the main image appears on the left or right side of the product list.
* **Image settings**
  * **Image:** Upload the main lifestyle image that represents the “look”.
  * **Image overlay opacity:** Adds a dark overlay to improve hotspot visibility and contrast.
  * **Corner radius:** Adjusts rounded corners of the image for a softer or sharper appearance.
* **Product card settings:** Control how linked products are displayed next to the image:
  * **Font size scale:** Adjusts product title size.
  * **Content alignment:** Aligns product information within cards.
  * **Image ratio:** Controls the shape of product images.
  * **Show second image on hover:** Displays an alternate product image when hovering.
  * **Show image border:** Adds a border around product images.
  * **Show vendor:** Displays brand/vendor name.
  * **Show product rating:** Shows product ratings (requires a rating app).
  * **Show color swatches:** Displays variant color options.
  * **Enable quick add button:** Allows customers to quickly view/add products without leaving the page.
* **Hotspot settings:** Hotspots are clickable icons placed on the image to highlight products.
  * **Hotspot icon:** Choose the icon style: Bag or Cart.
  * **Hotspot color:** Adjust contrast depending on image background.

### **3. Product block settings**

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

Each block represents one product linked to a hotspot on the image.

* **Product:** Select a product from your store to display and link.
* **Hotspot position:** Defines where the hotspot appears on the image:
  * **Horizontal:** Controls left → right position.
  * **Vertical:** Controls top → bottom position.


---

# 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://help.inspiredtheme.com/articles/sections/sections-available-in-inspiredtheme/shop-the-look.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.