Lookbook
Eine kaufbare Galerie direkt aus einem einzigen Bild
Lookbook verwandelt ein einzelnes Bild in eine kaufbare Szene. Laden Sie ein Foto hoch, platzieren Sie WooCommerce-Produkte als Hotspots und binden Sie das Ergebnis mit dem Shortcode [lookbook id="123"] ein. Aktiviert ein Kunde einen Hotspot, erscheint eine Produktkarte mit Vorschaubild, Titel, aktuellem Preis und einem Warenkorb-Link, sodass er direkt aus dem Bild heraus kaufen kann.
Kompatibel mit
So sieht es in der Praxis aus
Ein schönes Foto verkauft noch nicht
Ein Kunde sieht ein wunderschönes Foto mit mehreren Produkten, kann aber nicht erkennen, um welche Produkte es sich handelt oder wie er sie kaufen kann. Jeder muss jedes einzelne Produkt mühsam im Katalog suchen, und die meisten geben einfach auf.
- ✗ Kunden erkennen nicht, welche Produkte auf dem Foto zu sehen sind
- ✗ Kein Weg von der Inspiration zum Warenkorb
- ✗ Produkte manuell unter einem Foto zu verlinken ist mühsam
- ✗ Schwere Galerien verlangsamen den Shop und verschieben das Layout
Lookbook macht aus dem Bild eine kaufbare Szene
- ✓ Platzieren Sie beliebig viele Produkte als Hotspots auf einem Bild
- ✓ Eine Produktkarte mit Vorschaubild, Preis und Warenkorb-Button
- ✓ Die Daten werden live aus WooCommerce gelesen, Preise und Lagerbestand bleiben aktuell
- ✓ Ein schlankes Frontend ohne jQuery und ohne Layoutverschiebung
Das bietet Ihnen die kostenlose Version
Alles, was Sie brauchen, um den kompletten Look aus einem einzigen Bild zu verkaufen.
Kaufbares Bild
Platzieren Sie beliebig viele Produkte als Hotspots auf einem Bild.
Einfacher Hotspot-Editor
Positionieren Sie jedes Produkt über den X/Y-Prozentwert (0-100).
Barrierefreie Marker
Echte Buttons, per Tastatur bedienbar, mit Beschriftungen für Screenreader.
Produktkarte als Popover
Vorschaubild, Titel, aktueller Preis und ein Warenkorb-Link.
Saubere Deinstallation
Das Plugin entfernt seine Daten bei der Deinstallation.
Shortcode
[lookbook id="N"] zum Einbinden an beliebiger Stelle.
Live-Daten
Lookbook liest die Produkte aus WooCommerce, sodass Preise und Lagerbestand stets aktuell sind.
Sicher und schnell
Ein fehlendes Bild, fehlende Hotspots oder gelöschte Produkte werden sauber gerendert; kein jQuery und keine Layoutverschiebung.
In drei Schritten startklar
Erstellen Sie ein kaufbares Bild und fügen Sie Ihre ersten Hotspots hinzu.
Installieren
Aktivieren Sie Lookbook zusammen mit WooCommerce.
Ein Lookbook erstellen
Legen Sie unter Lookbooks → Erstellen das Beitragsbild fest und fügen Sie Hotspots mit Produkt-IDs hinzu.
Einbinden
Fügen Sie [lookbook id="123"] ein und prüfen Sie das Ergebnis im Shop.
Für wen es gedacht ist
Wenn mehrere Produkte in einem Foto vereint sind, ein direkter Weg von der Inspiration zum Warenkorb.
Mode und Outfits
Ein komplettes Outfit auf einem Foto, bei dem der Kunde jedes Teil über einen Hotspot kauft.
- ✓ Hotspots auf dem Bild
- ✓ Karte mit Preis
- ✓ In den Warenkorb
Interieur und Raumkonzepte
Ein Raum mit Möbeln und Accessoires, bei dem jedes Produkt direkt an Ort und Stelle kaufbar ist.
- ✓ X/Y-Editor
- ✓ Karte mit Preis
- ✓ Live-Daten
Geschenkideen
Eine Auswahl an Geschenken in einem Bild statt einer langen Liste von Links.
- ✓ [lookbook] Shortcode
- ✓ Live-Daten
- ✓ Ohne jQuery
Was PRO ergänzt, und warum es zählt
Akzentfarbe für Marker
Individuelle Farbe für Hotspot-Marker und den In-den-Warenkorb-Button der Produktkarte.
Galerie in Hotspot-Karten
Zeigen Sie die WooCommerce-Produktgalerie als wischbare Diashow (Scroll-Snap) direkt in den Hotspot-Karten an.
Mehrere Bilder pro Lookbook
Fügen Sie im Shop weitere shoppbare Bilder mit Tab-Navigation und eigenen Hotspots je Bild hinzu.
Video-Hotspots
Platzieren Sie Produkte auf einem Videobild, nicht nur auf einem Standbild (verfügbar).
Animationsstile (geplant)
Zusätzliche Marker- und Popover-Animationen über die drei kostenlosen Markerstile hinaus.
Klick-Analysen
Auswertung geöffneter Hotspots, Klicks auf Produktkarten und der Conversion vom Bild in den Warenkorb (verfügbar).
Was du bekommst: FREE oder PRO
PRO behält alles aus dem kostenlosen Plugin und ergänzt die Module unten.
Lookbook vs Shoppable Images vs WooCommerce Lookbook
Wie Lookbook im Vergleich zu den beliebten WooCommerce-Plugins für shoppbare Lookbooks abschneidet.
| Lookbook | Shoppable Images | WooCommerce Lookbook | |
|---|---|---|---|
| Kostenlose Version | Ja | Ja | Ja |
| Shoppbare Bild-Hotspots | Ja | Ja | Ja |
| Live-Produktdaten im Popover | Ja | Ja | Ja |
| Platzierung per Shortcode | Ja | Ja | Ja |
| Video-Hotspots | Pro | — | — |
| Klick-Analysen | Pro | — | — |
| Open Source (GPLv2) | Ja | GPL-Kern | GPL-Kern |
| Preis des kostenpflichtigen Plans | ab €29/Jahr | ab $39/Jahr | Kostenlos + Premium |
Wettbewerberdaten und Preise Stand Juni 2026; aktuelle Preise auf den Websites der Anbieter prüfen.
Mehr nötig? Lookbook Pro
Die KOSTENLOSE Version deckt ein einzelnes shoppable Bild ab. Lookbook Pro ergänzt das Marker-Styling, Produktgalerien in den Hotspot-Karten und weitere shoppable Szenen.
- ✓ Akzentfarbe für Marker (verfügbar)
- ✓ Produktgalerie in den Hotspot-Karten (verfügbar)
- ✓ Mehrere Bilder pro Lookbook (verfügbar)
- ✓ Video-Hotspots und Klick-Analyse (verfügbar)
Support und Ressourcen
Jedes Plugin hat eine eigene Dokumentation mit Einrichtungsanleitungen. Fehler und Fragen gehen in das öffentliche GitHub-Repository des jeweiligen Plugins, wir antworten offen.
Häufig gestellte Fragen
Wird WooCommerce benötigt?
Ja. Lookbook läuft nur, wenn WooCommerce aktiv ist. Jeder Hotspot verweist über die ID auf ein WooCommerce-Produkt und liest daraus Titel, Preis, Vorschaubild und den Warenkorb-Link. Ist WooCommerce nicht aktiv, gibt das Plugin im Shop nichts aus.
Wie finde ich die ID eines Lookbooks?
Öffnen Sie die Lookbooks-Liste und bearbeiten Sie das gewünschte Lookbook. Die ID erscheint in der Seiten-URL als Parameter post (zum Beispiel post=123). Verwenden Sie diese Zahl im Shortcode [lookbook id="123"].
Wie positioniere ich einen Hotspot?
Jeder Hotspot hat einen X- und einen Y-Wert, die als Prozentangabe von der oberen linken Ecke des Bildes im Bereich 0-100 eingegeben werden. Sie tragen sie als Zahlen im Hotspot-Editor auf der Bearbeitungsseite des Lookbooks ein. So richten Sie jeden Marker passend zu einem Produkt im Foto aus.
Was passiert, wenn ein verknüpftes Produkt gelöscht wird?
Dieser Hotspot wird beim Rendern des Lookbooks einfach übersprungen. Lookbook zeigt keinen Marker für ein Produkt an, das gelöscht oder nicht veröffentlicht wurde. Der Rest des Lookbooks wird ganz normal gerendert, ohne fehlerhaftes Markup.
Kann ich den Preis und einen Warenkorb-Button anzeigen?
Ja. Beides sind separate Schalter unter WooCommerce → Lookbook und gelten für alle Lookbooks gleichzeitig. Sie können den Text des Warenkorb-Links mit einer eigenen Beschriftung überschreiben; lassen Sie ihn leer, bleibt der Standard-Buttontext von WooCommerce je Produkt erhalten.
Verlangsamt es meine Seiten oder verschiebt es das Layout?
Nein. Stylesheet und Skript werden nur auf Seiten geladen, die tatsächlich ein Lookbook rendern, und das Skript wird verzögert geladen. Das Bild reserviert seinen Platz, sodass es keinen Cumulative Layout Shift gibt, und das Plugin verwendet kein jQuery.
Wie schneidet Lookbook im Vergleich zu Shoppable Images und WooCommerce Lookbook ab?
Mit Lookbook erstellen Sie kostenlos barrierefreie shoppbare Bilder mit einem einfachen Hotspot-Editor und Live-Produkt-Popovern, während Video-Hotspots und Klick-Analysen der kostenpflichtigen Edition ab 29 €/Jahr vorbehalten sind. Studio Wombat Shoppable Images ist ein Freemium-Plugin ab 39 $/Jahr, und VillaTheme WooCommerce Lookbook bietet eine kostenlose Version mit Premium-Upgrade. Alle drei platzieren Galerien per Shortcode und laufen auf GPL-Kernen. Preise Stand Juni 2026.
Verkaufen Sie den ganzen Look
Produkt-Hotspots, eine Karte mit Preis und Warenkorb-Button direkt aus dem Bild. Die vollständige KOSTENLOSE Edition unter GPL.
Dokumentation lesenDie KOSTENLOSE Version bietet ein vollständiges shoppable Bild, PRO ergänzt schon heute Akzentfarbe für Marker, Galerie-Hotspots in den Karten, mehrere Bilder pro Lookbook, Video-Hotspots und Klick-Analyse. Animationsstile sind geplant.