Magento 2 Lookbook with Clickable Hotspots: Shop the Look
SKU: LOOKBOOK1
- placed with a click in the admin, responsive in percent
- name, price and add-to-cart button right at the hotspot
- all products of an image into the cart in one click
- dedicated lookbook pages and CMS embedding
Einmaliger Kauf · inkl. 12 Monate Updates · zzgl. MwSt.
Magento 2 lookbook: turn inspiration into a shopping cart
The Magento 2 lookbook from Mironsoft turns an image into a shopping surface: editors place hotspots on products in the admin, visitors tap them and see name, price and an add-to-cart button. The principle is called shop the look and suits room settings, outfits, workshops and anything made of several parts. The module runs on Alpine.js and loads no additional library.
Hotspot editor
Upload an image, click the spot in the admin, search the product: the position is stored in percent and stays responsive.
Product card at the point
Name, price, availability and an add-to-cart button appear in a card at the hotspot.
Buy the whole look
An optional button adds all available products of the image to the cart together.
Several images
Any number of images per lookbook, sortable, with alt text and title per store view.
Page and widget
A dedicated lookbook page with a clean URL or embedding via CMS widget in any page.
Mobile-friendly
On smartphones a tap opens the card, and points stay accurate even on small images.
Why a Magento 2 lookbook does more than an inspiration image
A beautiful photo awakens wishes, but anyone who then has to search each item individually drops out. Merchants therefore search for Magento 2 shop the look or Magento 2 image with clickable products. The standard system offers nothing: images linked via HTML are laborious, break at responsive sizes and show no prices.
A Magento 2 lookbook solves exactly that. You maintain image and points once, the catalog supplies price and availability, and the visitor reaches the cart from the image in two clicks. An editor needs no HTML and no developer help for it.
Magento 2 image hotspots with products, set directly in the admin
In the admin you upload the image and click on the spot where a product sits. A search field finds the product by name or SKU, one click confirms. The Magento 2 Lookbook module stores the position as a percentage of image width and height, so the point sits in the same place at any image size. Points can be moved or deleted afterwards.
- Product search by name or SKU
- Position in percent, therefore responsive
- Move and delete without recreating
Magento 2 shop the look: a product card with price at the hotspot
The visitor hovers over a point or taps it, and a small card shows product image, name, current price and availability. Price and stock status come live from the catalog, so expired promotions do not linger. If a product is not deliverable, the card says so instead of offering an add-to-cart button.
- Price and stock status live from the catalog
- Add-to-cart button, with options a link to the product page
- Notice for products that are not deliverable
Magento 2 add the whole look to the cart
Optionally the lookbook shows a button below the image that adds all available products of the image to the cart together. Products with required options such as size or color are skipped and listed for the customer with links. A total of the included products can additionally be displayed.
- One click for all available products
- Products with required options listed separately
- Look total can optionally be shown
Magento 2 lookbook extension: own pages, widget and search engines
Every lookbook gets its own page with a readable URL, title and meta description per store view. Alternatively you embed a lookbook with a CMS widget in category, home or guide pages. Images get alt texts and load lazily. Products in the image create internal links that lead visitors and search engines to the product pages.
- Own page with URL, meta title and description
- CMS widget for any page
- Lazy loading and alt texts per store view
Where the Magento 2 lookbook supports revenue
Industries in which products are bought in combination.
Furniture and home
A photo of the furnished room links sofa, lamp, rug and shelf. Visitors buy the style, not just one piece.
Fashion and outfits
An outfit image links top, trousers and accessories. Products with a size choice lead to the product page.
Workshop, garden and tech
An image of the finished setup shows which parts belong together, such as a tool wall or home cinema.
Seasonal campaigns
A campaign image on the home page links the promoted products. Image and points can be swapped per campaign without touching theme code.
Magento 2 lookbook: without and with the module compared
The difference to images linked via HTML or an image map.
| Topic | Without module | With Mironsoft Lookbook |
|---|---|---|
| Maintenance | HTML or image map by hand | Click in the admin, product search |
| Responsive | Coordinates break at other sizes | Positions in percent |
| Price and stock | Not visible or outdated | Live from the catalog |
| Cart | Only a link to the product page | Button on the card and optionally for the whole look |
| Multilingual | Maintaining image and text twice | Title, alt text and meta per store view |
How we introduce the Magento 2 lookbook in your shop
The process after you place the order.
Briefing
You tell us the intended images, pages and the desired look of the product card.
Installation
We install the Magento 2 Lookbook module in your shop and integrate it into your Hyvä theme.
First lookbook
Together we create an example so your team gets to know the editor.
Page and widget
We set up the lookbook page and, if desired, the widget embedding. A Magento 2 lookbook saves time in image maintenance here.
Handover
Your team maintains new looks itself, we take over appearance adjustments.
How the lookbook differs from image gallery, banner slider and social feed
The Mironsoft image gallery shows collections of images without product reference. The banner slider rotates promotional images with one link per image. The Instagram shop module embeds social media posts. The Magento 2 lookbook works differently: one image carries several product hotspots with price and cart.
The Magento 2 Lookbook modules can be combined, for instance a lookbook image as a slide in the banner slider. The lookbook suits Hyvä themes because it runs with Alpine.js and without an additional library.
No download — personal setup instead
Lookbook is not listed here as a ready-made download file for self-installation. The purchase is a service commission: we get in touch after the purchase, install the module in your shop and set up pages, widget and the product card appearance together with you.
Frequently asked questions
Everything important about hotspots, product cards, cart and how the purchase works.
How can I create an image with clickable products in Magento 2?
What does shop the look mean?
Are hotspots accurate on smartphones?
Are prices and stock status shown up to date?
Can I put a whole look into the cart?
How do I embed a lookbook on a page?
Does the Magento 2 lookbook work with Hyvä?
Can I maintain images and texts per language?
How does the lookbook differ from the image gallery?
Can I download and install the module myself?
Recently Viewed Products
Magento 2 Lookbook – Mironsoft