EHERO Woo Swatches – Visuelle Muster für WooCommerce-Variationen

Visuelle Muster für WooCommerce-Variationen

Die nativen Dropdown-Auswahlen von WooCommerce verstecken deine Varianten hinter einem grauen Menü. Der Kunde sieht nicht, welche Farben verfügbar sind, muss das Dropdown Größe für Größe öffnen und bricht das Produkt oft ab, ohne zu verstehen, was du verkaufst. In einem Mode-, Schuh- oder Deko-Katalog ist dieses Dropdown ein direkter Hemmschuh für die Conversion.

EHERO Woo Swatches löst dieses Problem mit visuellen Mustern für WooCommerce-Variationen. Das Plugin fängt das Standard-Dropdown von Woo automatisch ab und ersetzt es durch einfarbige Farbmuster, Bild-Miniaturen, Text-Buttons, diagonale zweifarbige Swatches und Premium-Verläufe. Der Kunde sieht alle Optionen auf einmal, mit Tooltip beim Darüberfahren, Produktbildwechsel bei Auswahl der Variante, in Echtzeit aktualisiertem Preis und Lagerhinweis pro Variante.

Außerdem erscheinen diese visuellen Muster für WooCommerce-Variationen auch in der Shop-Übersicht: Der Kunde wählt Farbe oder Größe, ohne die Produktseite zu öffnen, und kann direkt aus dem Archive in den Warenkorb legen. Alles ist pro Attribut und pro Begriff konfigurierbar, mit einem Design-Panel, das Form, Größe, Ränder, Schatten und den Stil des ausgewählten oder ausverkauften Swatches steuert und die Farben deines Themes über CSS Custom Properties übernimmt.

Fünf Swatch-Typen, pro Attribut konfigurierbar

Jedes Attribut deines Katalogs wird in dem Format angezeigt, das es am besten repräsentiert, ohne Kriterien zu vermischen.

• Einfarbige Farbe mit Muster aus dem im Begriff gespeicherten Hex-Wert
• Bild/Miniatur für Muster, Texturen oder Materialien
• Text-Label (S, M, L, XL) mit Hintergrundfarbe, Textfarbe und optionalem Icon
• Diagonaler zweifarbiger Swatch bei 135º und vordefinierte Premium-Verläufe (Gold, Silber, Bronze, Ozean…)

Produktseite, die konvertiert

Das Plugin ersetzt das native WooCommerce-Dropdown und synchronisiert sich mit dem Variationsformular von Woo.

• Ausgewählter Swatch mit konfigurierbarem Rand oder visuellem Häkchen markiert
• Ausverkaufte Variante mit Kreuz durchgestrichen, halbtransparent oder verborgen, je nach Einstellung
• Wechsel des Galerie-Bildes bei Auswahl der Variante (gallery swap)
• Preis in Echtzeit, Lagerhinweis ‘Nur noch X’ und Preisdelta zwischen Varianten

Swatches auch in der Shop-Übersicht

Kunden wählen die Variante, ohne die Produktseite zu öffnen, direkt aus dem Archive oder dem Shop.

• Konfigurierbare Position: vor dem Bild, nach dem Titel oder nach dem Preis
• Produktbildwechsel beim Klick auf einen Swatch in der Übersicht
• Begrenzung sichtbarer Swatches mit ‘+N’-Anzeige, damit es nicht überladen wirkt
• Variante per AJAX in den Warenkorb legen mit Aktualisierung des Mini-Warenkorbs

Design-Panel mit CSS Custom Properties

Du steuerst das Erscheinungsbild der Swatches über das Panel und übernimmst die Farben deines Themes.

• Quadratische, runde oder abgerundete Form und Swatch-Größe in Pixeln
• Rand, Radius, Abstand (Gap) und Skalierung beim Darüberfahren mit der Maus
• Stil des ausgewählten Swatches (Rand/Häkchen) und des ausverkauften (Kreuz/Opazität/verborgen)
• Variablen –ehero-swatch-* und benutzerdefiniertes CSS für erweiterte Anpassungen

Echte Kompatibilität mit deinem Stack

Entwickelt, um mit den Themes und Buildern zu funktionieren, die Shops wirklich nutzen.

• Kompatibel mit HPOS (hochleistungsfähige Bestelltabellen von WooCommerce)
• Automatische Neuinitialisierung in Bricks Builder und per AJAX geladenem Inhalt (Quick View)
• Verzögertes Laden in Übersichten mit IntersectionObserver, um die Performance nicht zu beeinträchtigen
• Unterstützt variable Produkte, variable-subscription und ehero_variable_subscription

Labels, Preis-Suffixe und Auto-Auswahl

Details, die die Darstellung von Preis und Optionen jedes Produkts verfeinern.

• Konfigurierbares Preis-Suffix in Produktseite und Übersicht (z. B. ‘MwSt. nicht enthalten’) mit Farbe und Größe
• Stil der Attribut-Labels: Farbe, Größe und Schriftgewicht oder ausblenden
• Tooltip mit dem Namen der Variante beim Darüberfahren mit der Maus
• Bild-Fallback (Variante, Produkt oder keines), wenn ein Begriff keine eigene Miniatur hat

Ideal für

Wenn du visuelle Muster für WooCommerce-Variationen suchst, ist das dein Tool. Besonders geeignet für:

📋 Systemanforderungen

Getestete Kompatibilität mit den aktuellen Versionen von WordPress und WooCommerce.

🛟 Technischer Support

E-Mail-Support auf Spanisch* unter soporte@consultoriaehero.com und Online-Handbuch (ES/EN), mit automatischen Updates direkt aus deinem Dashboard.

⚖️ Vergleich: Warum EHERO Woo Swatches?

Was Woo Swatches von den Alternativen unterscheidet.

Wie viele Verkäufe verlierst du jeden Tag, weil deine Kunden das Dropdown für Farben und Größen gar nicht erst öffnen?

Aktiviere noch heute die visuellen Muster für WooCommerce-Variationen und verwandle deine Dropdowns in ein Einkaufserlebnis, das wirklich konvertiert.

Entdecke alle unsere Plugins für WooCommerce oder besuche den Shop von Consultoría EHERO.

*Der Support deckt Vorfälle, Fehler und die Installation des Plugins ab; er umfasst keine Beratung, maßgeschneiderte Konfigurationen oder individuelle Entwicklungen. Es gelten Bedingungen.