A shoppable gallery straight from one image
Lookbook turns a single image into a shoppable scene. Upload a photo, pin WooCommerce products as hotspots, and embed the result with [lookbook id="123"] or the Lookbook block. When a shopper activates a hotspot, a product card appears with the thumbnail, title, live price and an add-to-cart link — so they buy straight from the image.
Works with
A styled photo does not sell
A shopper sees a beautiful photo with several products, but cannot tell which products they are or how to buy them. Everyone has to hunt each one down in the catalog — and most simply give up.
- ✗ Shoppers cannot tell which products are in the photo
- ✗ No path from inspiration to cart
- ✗ Manually linking products under a photo is tedious
- ✗ Heavy galleries slow the store and shift the layout
Lookbook turns the image into a shoppable scene
- ✓ Pin any number of products as hotspots on one image
- ✓ A product card with thumbnail, price and add to cart
- ✓ Data read live from WooCommerce — prices and stock stay current
- ✓ A lightweight front end with no jQuery and no layout shift
What you get in the free version
Everything you need to sell the whole look from a single image.
Shoppable image
Pin any number of products as hotspots on one image.
Simple hotspot editor
Position by X/Y percentage with a live image preview.
Accessible markers
Real buttons, keyboard operable, with screen-reader labels.
Product card popover
Thumbnail, title, live price and an add-to-cart link.
Three marker styles
Pulsing dot, plus sign, or numbered.
Shortcode and block
[lookbook id="N"] plus a Lookbook block to embed anywhere.
Live data
Lookbook reads products from WooCommerce, so prices and stock are always current.
Safe and fast
Missing image, no hotspots or deleted products render cleanly; no jQuery and no layout shift.
Up and running in three steps
Create a shoppable image and add your first hotspots.
Install
Activate Lookbook alongside WooCommerce.
Create a lookbook
Under Lookbooks → Add New, set the featured image and add hotspots with product IDs.
Embed it
Insert [lookbook id="123"] or the Lookbook block and check it on the storefront.
Who it is for
When several products live in one photo — a path from inspiration to cart.
Fashion and outfits
A whole outfit in one photo — the shopper buys each item from a hotspot.
- ✓ Hotspots on the image
- ✓ Card with price
- ✓ Add to cart
Interiors and room sets
A room with furniture and accessories — every product is buyable in place.
- ✓ X/Y editor
- ✓ Live preview
- ✓ Three marker styles
Gift guides
A set of gifts in one image instead of a long list of links.
- ✓ [lookbook] and block
- ✓ Live data
- ✓ No jQuery
Need more? Lookbook Pro
FREE covers a single shoppable image. Lookbook Pro will add multiple images per lookbook, animation styles, video hotspots and analytics.
- ✓ Multiple images per lookbook (planned)
- ✓ Animation styles and video hotspots (planned)
- ✓ Hotspot-open and conversion analytics (planned)
Support and resources
Every plugin has its own documentation with setup walkthroughs. Bugs and questions go to the public GitHub repository for that plugin — we answer in the open.
Frequently asked questions
Does it require WooCommerce?
Yes. Lookbook only runs when WooCommerce is active, and hotspots link to WooCommerce products.
How do I find a lookbook's ID?
Open the Lookbooks list; the ID is shown when editing (post=123 in the URL). Use it in the shortcode or block.
How do I position a hotspot?
Each hotspot has an X and a Y value, both percentages from the top-left of the image (0–100). The editor shows a live preview.
What happens if a pinned product is deleted?
That hotspot is simply skipped. Lookbook never renders a marker for a product that is gone or unpublished.
Can I show the price and an add-to-cart button?
Yes. Both are toggles under WooCommerce → Lookbook, and you can customise the add-to-cart label.
Will it slow my pages down or shift the layout?
No. The stylesheet and script load only on pages that render a lookbook, the script is deferred, and the image reserves its space, so there is no layout shift.
Sell the whole look
Product hotspots, a card with price and add to cart straight from the image. The full FREE edition under GPL.
Read the docsFREE is a complete shoppable image — PRO adds multiple images, animations and video hotspots (planned).