WooCommerce Produkt-Badges: Angebot, Neu und Bestseller

In einem Raster ähnlicher Produkte werden die Artikel angeklickt, die herausstechen. Produkt-Badges sind einer der günstigsten Wege, genau das zu erreichen: ein kleines Angebots-, Neu- oder Bestseller-Label auf dem Produktbild, das ins Auge fällt und dem Kunden einen Grund gibt, genauer hinzusehen. Sie kosten nichts in der Anzeige, sie spiegeln Fakten wider, die Sie ohnehin zu jedem Produkt vorliegen haben, und sie wirken genau in dem Moment, in dem ein Besucher eine Kategorie durchsieht und entscheiden will, wohin er zuerst klickt. Dieser Leitfaden erklärt, wie Badges in WooCommerce funktionieren, welche tatsächlich den Verkauf ankurbeln, was ein gutes Badge-Werkzeug können muss und wie das kostenlose Plugin Marks automatische und manuelle Badges hinzufügt, ohne die Performance zu beeinträchtigen.

Was Produkt-Badges sind

Ein Produkt-Badge ist ein kleines Label, das über dem Produktbild platziert wird, sowohl in Listen als auch auf der einzelnen Produktseite. Jedes Badge trägt eine kurze, auf einen Blick erfassbare Botschaft, die ein Kunde lesen kann, ohne innezuhalten. Die gängigen Badges entsprechen direkt dem, was einen Kunden interessiert:

• Angebot oder ein Rabatt-Prozentsatz, der eine Preissenkung signalisiert.
• Neu, das kürzlich hinzugefügte Produkte kennzeichnet.
• Geringer Bestand, das sanfte Knappheit erzeugt.
• Bestseller, das sozialen Beweis liefert.
• Kostenloser Versand und Nicht vorrätig, die zwei Fragen beantworten, die ein Kunde sonst erst durch einen Klick klären müsste.

Der Wert eines Badges liegt darin, dass es einen Fakt im Moment der Entscheidung sichtbar macht. Ein Kunde, der eine Kategorie überfliegt, liest nicht jeden Titel und jede Beschreibung, sondern achtet auf Hinweise. Ein Badge ist ein solcher Hinweis, platziert genau dort, wo der Blick ohnehin schon ruht.

Warum sie die Conversion steigern

Badges funktionieren, weil Online-Einkaufen schnell und visuell abläuft. Die Entscheidung, ein Produkt anzuklicken, fällt in ein, zwei Sekunden und wird von dem getrieben, was heraussticht. Ein gut platziertes Badge gibt dem Kunden einen Grund, anzuhalten:

• Dringlichkeit durch Angebot, Rabatt-Prozentsatz und Geringer Bestand, die zu einer Entscheidung anregen statt zu einem “vielleicht später”.
• Sicherheit durch Bestseller, das die Zuversicht anderer Käufer überträgt, ohne dass der Kunde eine einzige Bewertung lesen muss.
• Aktualität durch Neu, das wiederkehrende Besucher direkt auf das hinweist, was sich seit ihrem letzten Besuch geändert hat.
• Klarheit durch Kostenloser Versand, das einen häufigen Zögergrund ausräumt, bevor ein Produkt überhaupt geöffnet wird.

Der Gewinn entsteht durch Relevanz, nicht durch Dekoration. Ein Shop, der alles mit Badges versieht, trainiert Kunden darauf, Badges zu ignorieren. Ein Shop, der das Wahre und das Nützliche kennzeichnet, den tatsächlich rabattierten Artikel, den wirklich knappen Bestand, verdient sich den Klick. Die Disziplin liegt darin, weniger, aber zutreffende Badges zu zeigen, nicht mehr.

Tipp: Zeigen Sie weniger, dafür wahre Badges. Alles zu kennzeichnen trainiert Kunden darauf, sie zu ignorieren; zwei oder drei zutreffende Badges lesen sich klar, sechs nicht.

Automatisch schlägt manuell

Die nützlichsten Badges laufen über Regeln, damit sie korrekt bleiben, ohne dass jemand Produkte von Hand bearbeitet. Ein manueller “Angebot”-Aufkleber, den jemand nach dem Ende der Aktion vergessen hat zu entfernen, ist schlimmer als gar kein Badge, denn er bringt Kunden bei, dass Ihre Badges lügen. Regelbasierte Badges vermeiden das vollständig:

Warnung: Ein manueller “Angebot”-Aufkleber, der nach dem Ende der Aktion hängen bleibt, ist schlimmer als gar kein Badge, denn er bringt Kunden bei, dass Ihren Badges nicht zu trauen ist.

• Angebot erscheint, sobald ein Produkt rabattiert ist, und verschwindet in dem Moment, in dem die Aktion endet.
• Rabatt-Prozentsatz liest dieselben Preisdaten und zeigt die Höhe der Senkung.
• Geringer Bestand erscheint, wenn der Lagerbestand auf einen von Ihnen festgelegten Schwellenwert oder darunter fällt.
• Neu erscheint für einen festgelegten Zeitraum nach der Veröffentlichung eines Produkts und zieht sich danach von selbst zurück.
• Bestseller erscheint, sobald ein Produkt eine von Ihnen gewählte Verkaufszahl überschreitet.

Manuelle Badges haben weiterhin ihren Platz für die Fälle, die sich nicht als Regel ausdrücken lassen, etwa eine handverlesene Mitarbeiterempfehlung oder ein saisonaler Hinweis auf ein bestimmtes Produkt. Das richtige Werkzeug bietet beides, wobei automatische Badges den Großteil der Arbeit erledigen und ein manuelles Badge dort verfügbar ist, wo Sie wirklich übersteuern müssen. Marks for WooCommerce unterstützt beides: eine Reihe automatischer, regelbasierter Badges sowie ein manuelles Badge pro Produkt.

Was ein gutes Badge-Werkzeug können muss

Bevor man sich ein konkretes Plugin ansieht, hilft es zu wissen, was ein installierenswertes Badge-Werkzeug von einem unterscheidet, das mehr Probleme schafft als es löst. Nutzen Sie diese Liste als Checkliste:

• Regelbasierte Automatik. Badges, die sich aus echten Produktdaten selbst berechnen, sodass sie stets aktuell sind.
• Konfigurierbare Schwellenwerte. Sie entscheiden, was als “neu”, “geringer Bestand” oder “Bestseller” zählt, denn diese Zahlen unterscheiden sich von Shop zu Shop.
• Steuerung pro Badge. Schalten Sie jeden Badge-Typ unabhängig ein oder aus und legen Sie den Label-Text fest, damit die Formulierung zu Ihrer Marke und Sprache passt.
• Rendering nur per CSS. Ein Badge ist ein Label und braucht kein JavaScript. Die Darstellung mit CSS lädt kein zusätzliches Skript und führt keines aus.
• Keine Layout-Verschiebung. Das Badge sollte in reserviertem Raum sitzen, sodass es Bild oder Titel beim Laden der Seite niemals verschiebt, was Ihre Core Web Vitals schützt.
• Steuerung der Platzierung. Entscheiden Sie, ob Badges in Listen, auf einzelnen Produktseiten oder an beiden Stellen erscheinen.
• Ein Erscheinungsbild, das zum Theme passt. Form, Großschreibung und eine sinnvolle Begrenzung, wie viele Badges sich auf einem Bild stapeln dürfen.

Zwei Dinge stehen bewusst nicht auf dieser Liste für ein kostenloses, universelles Werkzeug: Animationen und umfangreiche Anpassung pro Produkt. Badges, die hüpfen oder ein- und ausblenden, lenken die Aufmerksamkeit auf sich selbst statt auf das Produkt, und das Styling pro Produkt ist ein Wartungsaufwand, den regelbasierte Badges gerade vermeiden sollen.

Wie Marks es löst

Marks ist ein kostenloses, quelloffenes Plugin, das Badges auf WooCommerce-Produkte setzt und rund um die obige Checkliste aufgebaut ist. Alles, was es anzeigt, wird auf Ihrem eigenen Server aus Daten berechnet, die WooCommerce bereits vorhält, also Preis, Bestand, Verkäufe, Produktdaten und Versandklasse. Es gibt also nichts zu synchronisieren und nichts wird irgendwohin gesendet.

Automatische Angebots-, Neu- und Bestseller-Label auf den Produktkarten im Shop, alle nur per CSS gerendert.

Die automatischen Badges

Marks liefert sieben automatische Badges: Angebot, Neu, Geringer Bestand, Bestseller, Rabatt-Prozentsatz, Kostenloser Versand und Nicht vorrätig. Jedes hat einen eigenen Ein/Aus-Schalter und ein eigenes individuelles Label, sodass Sie “Angebot” in “Promo” umbenennen oder jedes Label in die Sprache Ihres Shops übersetzen können. Drei davon lesen Schwellenwerte, die Sie steuern: Das Neuheits-Zeitfenster (standardmäßig 30 Tage) bestimmt, wie lange Neu angezeigt wird, die Geringer-Bestand-Grenze legt fest, wann Geringer Bestand erscheint, und die Bestseller-Verkaufszahl entscheidet, ab wann Bestseller greift. Kostenloser Versand wird über die Versandklasse eines Produkts erkannt. Weil all das regelbasiert ist, bleiben die Badges von selbst korrekt, während sich Preise ändern, Bestände bewegen und Produkte aus dem Neu-Zeitfenster herausfallen.

Das manuelle Badge

Für die Fälle, die sich nicht als Regel abbilden lassen, fügt Marks ein einziges manuelles Badge hinzu: ein shopweites Label samt Farbe, das Sie pro Produkt einschalten. Sie legen Label und Farbe einmal auf der Marks-Einstellungsseite fest und ordnen sie dann bestimmten Produkten über das Produkt-Meta _marks_manual_text (mit einem optionalen _marks_manual_style) zu. Das ist das richtige Werkzeug für eine Mitarbeiterempfehlung oder einen einmaligen Hinweis, bewusst einfach gehalten, damit es nicht zu einem Styling-Projekt pro Produkt wird.

Rendering und Platzierung

Hinweis: Jedes Marks-Badge wird ausschließlich per CSS gerendert, fügt also kein JavaScript zum Laden oder Ausführen hinzu und verursacht keine Layout-Verschiebung, was Listenseiten schnell und stabil hält.

Jedes Marks-Badge wird mit CSS gezeichnet und sitzt über dem Produktbild, sodass es kein JavaScript hinzufügt und keine Layout-Verschiebung verursacht, wenn die Seite lädt. Badges erscheinen auf der einzelnen Produktseite sowie in Shop-, Kategorie- und Schlagwort-Listen, und über die Platzierungssteuerung wählen Sie Einzelseiten, Listen oder beides. Die Darstellungssteuerung umfasst die Form (Pille oder Rechteck), Großschreibung und eine Obergrenze pro Kontext, damit ein einzelnes Bild nie unter fünf überlappenden Badges verschwindet. Es gibt außerdem eine optionale Einstellung, mit der sich das eigene Standard-Angebotssymbol von WooCommerce ausblenden lässt, wenn das Marks-Angebots-Badge aktiv ist, damit sich beide nicht in die Quere kommen.

Der Shortcode

Wenn Sie Badges an einer Stelle außerhalb der üblichen Produktvorlagen platzieren möchten, etwa auf einer Seite, in einem Beitrag oder Widget, stellt Marks den Shortcode [marks_badges] bereit. Ohne Attribute verwendet er das aktuelle Produkt innerhalb einer Schleife oder auf einer einzelnen Produktseite. Mit id sprechen Sie ein bestimmtes Produkt an und mit context (single oder loop) wählen Sie den Render-Stil, zum Beispiel [marks_badges id="123" context="loop"].

Einrichtung

Bis Badges live sind, vergehen nur wenige Minuten:

Der Marks-Einstellungsbildschirm im WordPress-Admin, wo Sie jedes Badge schalten und Label sowie Schwellenwerte festlegen.

1. Installieren Sie das Plugin über Plugins → Installieren, oder laden Sie es nach /wp-content/plugins/marks hoch. WooCommerce muss installiert und aktiv sein.
2. Aktivieren Sie es.
3. Öffnen Sie das oberste Menü Marks, schalten Sie Badges über den globalen Schalter ein und wählen Sie, welche automatischen Badges erscheinen sollen.
4. Passen Sie die Schwellenwerte (Neuheits-Zeitfenster, Geringer-Bestand-Grenze, Bestseller-Verkaufszahl) an Ihren Shop an, legen Sie die gewünschten Label fest und wählen Sie Platzierung und Erscheinungsbild.

Das ist die gesamte Einrichtung. Einstellungen werden beim Speichern bereinigt und auf zulässige Werte begrenzt, das Plugin ist übersetzungsbereit mit beiliegender POT-Datei, es erklärt die Kompatibilität mit HPOS sowie den Warenkorb- und Kassen-Blöcken und entfernt seine Daten bei der Deinstallation rückstandslos.

Praktische Tipps

Ein Werkzeug liefert den Mechanismus, doch wie Sie es einsetzen, entscheidet, ob Badges helfen oder zu Lärm werden. Ein paar Hinweise:

• Zeigen Sie weniger, dafür wahre Badges. Widerstehen Sie der Versuchung, alles zu kennzeichnen. Die Obergrenze pro Kontext gibt es aus gutem Grund: Zwei oder drei relevante Badges lesen sich klar, sechs nicht.
• Stimmen Sie die Schwellenwerte auf Ihren Shop ab. “Geringer Bestand” bedeutet für einen Hersteller, der zehn Stück verkauft, etwas anderes als für ein Lager, das Tausende absetzt. Setzen Sie die Geringer-Bestand-Grenze und die Bestseller-Zahl auf Werte, die für Sie wirklich aussagekräftig sind.
• Passen Sie das Neu-Zeitfenster an Ihren Katalog-Rhythmus an. Ein Shop, der wöchentlich Produkte hinzufügt, will ein kürzeres Neuheits-Zeitfenster als einer, der jede Saison ein Sortiment erneuert, damit Neu auf das zeigt, was sich tatsächlich geändert hat.
• Schreiben Sie Label in Ihrer Sprache. Der individuelle Label-Text ist dafür da, dass Badges nach Ihrem Shop klingen und nicht nach einem generischen Plugin. Halten Sie sie kurz, ein Badge wird auf einen Blick gelesen.
• Achten Sie auf das Standard-Angebotssymbol. Wenn Sie das Marks-Angebots-Badge aktivieren, schalten Sie die Option ein, die das eingebaute Angebotssymbol von WooCommerce ausblendet, damit Sie nicht zwei konkurrierende Markierungen auf demselben Bild zeigen.

Marks im Vergleich zu Standard-WooCommerce

Das WooCommerce-Core zeigt auf rabattierten Artikeln nur ein einziges “Angebot”-Symbol und sonst nichts. Hier ist der Unterschied speziell bei Produkt-Badges:

Funktion	Standard-WooCommerce	Marks
Badge-Typen	Nur Angebot	Angebot, Neu, Geringer Bestand, Bestseller, Rabatt-Prozentsatz, Kostenloser Versand, Nicht vorrätig
Automatische, regelbasierte Badges	Nur Angebot	Ja, sieben Regeln mit konfigurierbaren Schwellenwerten
Individueller Label-Text	Nein	Ja, pro Badge
Manuelles Badge	Nein	Ja, eines pro Produkt
Steuerung der Platzierung	Nein	Einzelseite, Listen oder beides
Darstellungssteuerung	Nein	Form, Großschreibung, Obergrenze pro Kontext
Shortcode-Platzierung	Nein	[marks_badges]
Rendering	Theme-abhängig	Nur CSS, ohne JavaScript
Layout-Stabilität	nicht verfügbar	Keine Layout-Verschiebung
Planung, bedingte Regeln, Bild-Badges, A/B	Nein	Ja (PRO)
Kosten	Kostenlos (Core)	Kostenlos (GPL); PRO ergänzt Kampagnen, Bedingungen, Bild-Badges und A/B

Kostenlos im Vergleich zu PRO

Das kostenlose Marks-Plugin ist ein vollständiges Badge-Werkzeug, kein Lockangebot: Sieben automatische Badges mit individuellen Label und Schwellenwerten, ein manuelles Badge, Steuerung von Platzierung und Erscheinungsbild, der Shortcode und das Rendering ausschließlich per CSS sind alle enthalten. Marks Pro ist ein kostenpflichtiges Add-on, das das kostenlose Plugin installiert und aktiv voraussetzt, und es baut für aktionsgetriebene und umsatzstarke Shops darauf auf:

• Geplante und gezielte Badges. Eine eigene Admin-Seite, auf der Sie Kampagnen-Badges mit einem Label, individuellen Farben, einem optionalen Start- und Enddatum-Fenster und einer Zielsteuerung nach bestimmtem Produkt, Kategorie oder Schlagwort definieren. Jedes Badge rendert automatisch nur innerhalb seines Zeitfensters und passend zu seinen Zielen.
• Bedingte Anzeigeregeln. Shopweite Regeln, die ein gestyltes Badge rendern, wenn ein Produkt eine Bedingung erfüllt, etwa die Zugehörigkeit zu einer Kategorie, ein Preis über oder unter einem Schwellenwert oder ein Bestand auf oder unter einer Menge.
• Bild-Badges. Eine Bild-Badge-URL pro Produkt für ein Zertifikat oder Markenlogo, gerendert in fester Höhe und unter Beibehaltung des Seitenverhältnisses, sodass es das Layout nicht verschiebt.
• A/B-Label-Sets. Konkurrierende Badge-Label, die über Besucher hinweg rotiert werden, mit haftenden Cookies und Impressionszählern pro Variante, damit Sie testen können, welche Formulierung wirklich gewinnt.

Wenn Ihre Badges statische Fakten über Produkte sind, deckt das kostenlose Plugin Sie ab. Fahren Sie zeitlich begrenzte Kampagnen oder wollen Sie Label testen, verdient sich PRO seinen Platz.

Die Kurzfassung

Produkt-Badges sind eine kleine Ergänzung mit großer Hebelwirkung: Sie lassen die richtigen Produkte herausstechen und geben Kunden einen Grund zum Klicken. Bevorzugen Sie automatische, regelbasierte Badges, damit sie korrekt bleiben, während sich Preise, Bestände und das Produktalter ändern, halten Sie sie wenige und wahr, damit sie ihre Bedeutung behalten, und rendern Sie sie nur per CSS, damit Listenseiten schnell und stabil bleiben. Das kostenlose Marks-Plugin gibt Ihnen sieben automatische Badges, ein manuelles Badge, individuelle Label, Schwellenwerte sowie Steuerung von Platzierung und Erscheinungsbild, alles nur per CSS, ohne JavaScript und ohne Layout-Verschiebung. Marks Pro ergänzt geplante Kampagnen, bedingte Regeln, Bild-Badges und A/B-Label-Sets, sobald Sie bereit sind, Aktionen zu fahren und zu testen, was funktioniert.