Shop the look

The "Shop the Look" section allows you to showcase stunning real-life images of your products by highlighting them with interactive points. This feature enables customers to explore and shop the items directly within the image, enhancing engagement and providing a visually appealing shopping experience.

Section settings

In this section, we offer two distinct stylings: standard and slider.

These can be found in the layout settings. It's essential to configure this setting first because the image size will vary between the two layouts, resulting in differences in the configuration of the points. Setting the layout preference beforehand ensures optimal presentation and consistency in the display of product images and associated points.

Once you've selected your preferred layout setting for the "Shop the Look" section, you'll need to determine the size of the section itself. You have the option to choose between full-width or container size. This choice will impact how the section is displayed on your website, so it's important to consider the overall design and layout of your page when making this decision.

Following the selection of the section size, you'll find two image pickers specifically designated for the image maps. It's important to note that the Image Map on the right only applies for the standard version of the section. These images serve as the canvases where your interactive points will be placed, allowing customers to explore and shop directly within the images.

Additionally, you have the option to select a new color scheme for the "Shop the Look" section, allowing you to customize its appearance to align with your brand aesthetic. Furthermore, you can edit the section heading content, style, size, and fill by adjusting the settings provided below, providing further flexibility in tailoring the section to suit your preferences and branding requirements.

You have the ability to enhance the "Shop the Look" section by adding a section description and a call-to-action button. Simply complete the settings below to provide additional context and encourage engagement with your products.

You can globally enable or disable the pagination and tooltips for this section. This provides you with the flexibility to tailor the interactive experience according to your preferences and the needs of your audience.

In the slider layout, you have the option to select an image aspect ratio for the product items. This allows you to ensure that the product images are displayed in a visually appealing and consistent manner within the slider, enhancing the overall aesthetic of your "Shop the Look" section.

The final general settings for the section allow you to set the padding for both desktop and mobile screens. You can easily adjust the padding by dragging the range slider to your preferred values, ensuring optimal spacing and alignment for a seamless viewing experience across different devices.

Block settings

In these settings, the only available block type represents a product, visually represented as a point on the image map within the "Shop the Look" section. This block type enables you to associate specific products with interactive points on the image, allowing customers to explore and shop directly from the visual representation of your products.

The next step involves setting the position of the point within the image. You'll adjust both the Horizontal and Vertical point positions for each product block. This customization allows you to precisely place the interactive points on the image map, ensuring accurate alignment and enhancing the visual presentation of your products within the section.

You can customize the appearance of the points by configuring the setting below to set the point color. This allows you to align the color of the points with your brand's aesthetic or to create visual contrast within the image map, enhancing the overall presentation of your products in the "Shop the Look" section.

The next set of settings pertains to the tooltips. To access these options, ensure that the "Show tooltips" option is enabled in the section settings. Once enabled, you can customize the tooltip position and add extra text to provide additional information or context for the products showcased in the "Shop the Look" section.

In conclusion, the "Shop the Look" section offers a versatile and engaging way to showcase your products within real-life contexts. With customizable settings for layout, image mapping, point positioning, color schemes, tooltips, and more, you have the flexibility to create visually stunning and informative displays tailored to your brand and audience preferences. By leveraging these features, you can enhance the shopping experience for your customers and drive engagement with your products.