Skip to content
WPPoland Documentation

Lookbook

Lookbook turns a single image into a shoppable scene. Upload a photo, pin your WooCommerce products to it 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.

Why stores pick Lookbook

Section titled “Why stores pick Lookbook”

Lookbook is built for stores that sell the look: fashion outfits, room sets, gift guides, recipe ingredient shots — anywhere several products live in one picture. It reads product data live from WooCommerce, loads assets only where a lookbook appears, uses no jQuery and causes no layout shift. The free edition is the full GPL product.

Highlights

Section titled “Highlights”
  • 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.
  • [lookbook id="N"] shortcode and a Lookbook block.
  • Live WooCommerce data — prices and stock are always current.
  • Graceful by design — missing image, no hotspots or deleted products render cleanly, never broken.
  • Fast and tidy — no layout shift, no jQuery, deferred script, translation ready, clean uninstall, HPOS and Cart/Checkout Blocks compatible.

How it works

Section titled “How it works”
  1. Create a lookbook under the Lookbooks menu and set its image with the Featured image box.
  2. Add a hotspot for each product: position it with an X and Y percentage (0–100 from the top-left) and enter the product ID. A live preview shows where each marker lands.
  3. Embed it with [lookbook id="123"] or the Lookbook block.

When a shopper activates a hotspot, a product-card popover opens. Deleted or unpublished products are simply skipped — Lookbook never renders a marker for a product that is gone.

Editions

Section titled “Editions”
  • Free on WordPress.org — shoppable image, hotspot editor, accessible markers, product-card popover, three marker styles, shortcode and block.
  • Pro (planned) for multiple images per lookbook, animation styles, video hotspots and analytics.

Next steps

Section titled “Next steps”