Um eine Mengenrabatt- oder Volumenrabatt-Tabelle auf einer Shopify-Produktseite anzuzeigen, fügst du entweder einen Theme-App-Block von einer Rabatt-App im Theme-Editor hinzu, oder du kodierst die Tabelle manuell in Liquid in deiner Produktvorlage. Der App-Block-Weg ist der No-Code-Pfad: Du setzt den Block unter den Add-to-Cart-Button und er rendert eine "Mehr kaufen, mehr sparen"-Staffel-Tabelle, ohne die Theme-Dateien zu berühren. Der wesentliche Teil ist, was danach passiert. Die angezeigte Tabelle muss synchron mit dem Rabatt bleiben, der beim Checkout gezündet wird, und sie muss SEO-sicher rendern, ohne Preise in Überschrift-Tags zu wickeln, die zusätzliche H1s erzeugen und dein Ranking still beschädigen. Wenn du diese zwei Dinge richtig machst, ist eine Staffel-Tabelle eine der höchsten-Hebel-Ergänzungen, die du zu einer Produktseite hinzufügen kannst. Wenn du sie falsch machst, zeigst du Kunden Preise, die der Checkout nicht akzeptiert, auf einer Seite, deren Überschriftenstruktur du gerade beschädigt hast.
Dieser Leitfaden behandelt, warum eine sichtbare Staffel-Tabelle den durchschnittlichen Bestellwert erhöht, den DIY-Liquid-Ansatz und die Wartungs-Fallen, die ihn beschädigen, Theme-App-Blöcke versus manuelles Kodieren, die echte SEO-Gefahr beim Rendern von Preisen als Überschrift-Tags, Core Web Vitals-Überlegungen und ein vollständig ausgearbeitetes Beispiel mit einer "Menge, Preis je, Du sparst"-Tabelle, die du kopieren kannst.
Warum eine Mengenrabatt-Tabelle auf der Produktseite anzeigen?
Ein Mengenrabatt ist ein gestaffelter Rabatt: Kaufe 3 und spare 10 Prozent, kaufe 6 und spare 15 Prozent, kaufe 12 und spare 20 Prozent. Der Rabatt kann vollkommen ohne jede Storefront-Anzeige existieren. Shopify wendet ihn beim Checkout an, ob der Kunde ihn jemals kommen sieht oder nicht. Das ist genau das Problem. Ein Rabatt, den der Käufer nicht sehen kann, ist ein Rabatt, der sein Verhalten nicht ändern kann.
Die Staffel-Tabelle ist die Merchandising-Hälfte des Angebots. Sie verwandelt eine stille Preisregel in eine sichtbare Einladung. Ein Kunde, der eine Einheit kaufen wollte, sieht in klaren Zahlen, dass das Kaufen von drei den Pro-Einheit-Preis senkt, und das Kaufen von sechs senkt ihn weiter. Das ist ein Nudge zu einem größeren Warenkorb, genau im Moment der Entscheidung platziert, direkt unter dem Add-to-Cart-Button.
Es gibt einen gut verstandenen Verhaltensgrund, warum das funktioniert. Eine Staffel-Tabelle setzt einen Anker und zeigt dann das "Du sparst"-Delta dagegen. Der Käufer bewertet nicht länger einen Preis isoliert; er vergleicht seine aktuelle Wahl mit einer sichtbar besseren, die ein oder zwei Einheiten entfernt ist. Für verbrauchbare, lagerfähige oder geschenkfreundliche Produkte treibt dieser Vergleich zuverlässig Einheiten. Großhandels- und B2B-Käufer erwarten ein Preis-Bruch-Raster als Selbstverständlichkeit, und sein Fehlen sieht wie eine fehlende Funktion aus.
Der Haken ist, dass die Tabelle nur hilft, wenn Käufer ihr vertrauen. Das erste Mal, wenn ein Kunde "6 für 34 Dollar je" auf der Produktseite sieht und dann beim Checkout 40 Dollar je berechnet wird, hast du nicht nur diese Bestellung verloren. Du hast ihm beigebracht, dass deine Preise nicht real sind. Deshalb können die Anzeige und die Rabatt-Engine nicht zwei separate Systeme sein, die heute zufällig übereinstimmen.
BILD-PLATZHALTER (Bild 1): Eine Mengenrabatt-Staffel-Tabelle auf einer Produktseite
Vorgeschlagene Visualisierung: Ein sauberes 16:9 Storefront-Mockup einer Shopify-Produktseite. Rechte Spalte zeigt Produkttitel, Preis und Add-to-Cart-Button. Direkt unter dem Button sitzt eine 4-zeilige Staffel-Tabelle mit Spalten "Menge", "Preis je" und "Du sparst". Zeile drei (6 bis 11) ist violett hervorgehoben als die aktive Staffel, mit einer kleinen "Du sparst 15%"-Note. Neutrale Produktfoto-Platzhalter links. Brand-Farben violett und Gold-Akzente, flaches modernes UI, keine echten Logos.
Welche Wege gibt es, eine Staffel-Tabelle auf einer Shopify-Produktseite anzuzeigen?
Es gibt drei praktische Routen, in grober Reihenfolge vom manuellsten zum wartbartesten.
Option 1: Die Tabelle manuell in Liquid kodieren
Du bearbeitest deine Produktvorlage (oder einen Abschnitt oder ein Snippet, das sie rendert) und schreibst das Tabellen-Markup selbst. Du kodierst entweder die Staffel-Werte als statisches HTML hart, oder du liest sie aus einem Produkt-Metafeld und loopers über sie in Liquid, sodass es datengesteuert ist. Das gibt dir volle Kontrolle über das Markup und Styling, und es ist wirklich die richtige Antwort für einen Store mit ein oder zwei Produkten und einem verfügbaren Entwickler.
Die Kosten sind Wartung, und sie sind höher als sie aussieht. Eine hartcodierte Tabelle ist eine zweite Kopie deiner Preise, die in deinem Theme lebt, getrennt vom Rabatt, der tatsächlich läuft. Jedes Mal, wenn du eine Staffel änderst, änderst du sie an zwei Stellen: dem Rabatt und dem Theme. Verpasse eine und die Tabelle lügt. Händler auf dem Shopify-Forum beschreiben genau dieses Muster, das Bauen einer handgebauten HTML-Tabelle für die Staffel-Anzeige und dann der Kampf, sie mit einer Rabatt-Regel synchron zu halten, die ganz woanders existiert. Es funktioniert bis zu dem Tag, an dem es still nicht tut.
Option 2: Eine metafeld-gesteuerte Liquid-Tabelle
Eine robustere DIY-Version speichert die Staffel-Daten in einem Produkt-Metafeld und rendert sie mit einer Liquid-Schleife, sodass die Tabelle datengesteuert statt pro-Produkt hartcodiert ist. Das ist besser; du bearbeitest Staffeln an einer strukturierten Stelle. Aber du eigentümest immer noch das Rendering, das responsive Styling, das Live-Update-JavaScript und entscheidend die Aufgabe, die Metafeld-Werte dem Rabatt gleich zu halten, den dein Rabatt nutzt. Nichts erzwingt diese Gleichheit für dich.
Option 3: Ein Theme-App-Block von einer Rabatt-App
Die No-Code-Route nutzt Shopify Theme-App-Extension-Framework. Gemäß Shopify Theme-App-Extensions-Dokumentation, erlauben diese Erweiterungen "Händlern, einfach dynamische Elemente zu ihren Themes hinzuzufügen, ohne Liquid-Vorlagen oder Code zu berühren", und die Docs listen "Preise, Bewertungen" unter den dynamischen Elementen auf, für die sie gebaut sind. Eine Staffel-Tabelle ist genau diese Art von Element.
Die App liefert einen App-Block. Im Theme-Editor öffnest du deine Produktvorlage, klickst Blöcke in einem Abschnitt hinzufügen, wählst den Staffel-Tabellen-Block der App und positionierst ihn, wo du möchtest, typischerweise direkt unter dem Add-to-Cart-Button. Du bearbeitest niemals Theme-Code. Shopify Docs bestätigen, dass Händler "App-Blöcke auf Abschnitt-Ebene hinzufügen, entfernen und umordnen können" direkt im Editor, und dass App-Blöcke "Styling-Eigenschaften vom Theme erben, wie Typografie und Farben", sodass die Tabelle deine Schriftarten und Design ohne Custom CSS anpasst.
Der wichtige strukturelle Vorteil ist, dass ein gut gebauter App-Block seine Staffel-Werte aus der gleichen Wahrheitsquelle liest wie der Rabatt, sodass die Anzeige und die Checkout-Mathematik nicht abweichen können. Das ist das ganze Spiel, und es ist der Grund, warum diese Route für die meisten Stores gewinnt.
App-Blöcke gegen App-Embed-Blöcke: Welcher ist die Staffel-Tabelle?
Shopify Theme-App-Extension-Framework hat zwei Arten von Blöcken, und es ist wert zu wissen, welcher welche ist, weil die Staffel-Tabelle eine von ihnen und nicht die andere ist.
Ein App-Block nutzt target: section in seinem Schema. Es ist ein sichtbares, positioniertes Element, das ein Händler an einer spezifischen Stelle in einem Abschnitt droppt, und es kann auf dynamische Quellen wie das aktuelle Produkt zeigen. Nach Shopify Konfigurations-Dokumentation, werden App-Blöcke im Theme-Editor hinzugefügt, entfernt und umgeordnet und können "auf eine dynamische Quelle zeigen, um Daten für unterschiedliche Produkte anzuzeigen, wenn sie auf der Seite rendern." Das letzte Teil ist genau das, was eine Staffel-Tabelle braucht: Sie muss die Staffeln für das Produkt anzeigen, das die Seite rendert. Die Staffel-Tabelle ist ein App-Block.
Ein App-Embed-Block nutzt target: head, compliance_head, oder body. Shopify "rendert und injiziert App-Embed-Blöcke vor den schließenden head- und body-Tags", und sie sind für schwebende oder überlagerte Elemente wie Chat-Blasen, Abzeichen und Analytics- oder SEO-Tags gedacht, nicht für Inhalte an einer genauen Stelle im Layout. App-Embed-Blöcke sind standardmäßig deaktiviert und Händler schalten sie unter Theme-Einstellungen, App-Embeds ein. Eine Staffel-Tabelle ist kein Embed-Block, weil sie an einer spezifischen Position im Produkt-Layout leben muss, nicht über der Seite schweben.
Ein Vorbehalt, der zu jedem ehrlichen Leitfaden gehört: App-Blöcke werden nur in Online Store 2.0 Themes unterstützt, die JSON-Vorlagen nutzen. Shopify Onboarding-Dokumentation besagt, dass "App-Blöcke nur in Themes unterstützt werden, die JSON-Vorlagen enthalten, auch bekannt als Online Store 2.0 Themes." Wenn du auf einem viel älteren Vintage-Theme bist, ist die Drag-and-Drop-Block-Platzierung nicht verfügbar und du bist zurück zu einem Liquid-Ansatz oder einem Theme-Upgrade. Die meisten Stores auf einem modernen Shopify-Theme sind bereits auf Online Store 2.0.
BILD-PLATZHALTER (Bild 2): Hinzufügen des Staffel-Tabellen-App-Blocks im Theme-Editor
Vorgeschlagene Visualisierung: Ein 16:9 Screenshot-Stil-Mockup des Shopify-Theme-Editors. Linkes Panel zeigt den Abschnitt-Baum für eine Produktvorlage mit einer erweiterten "Blöcke hinzufügen"-Schaltfläche, die eine "Mengenrabatt-Tabelle"-Block-Option der App unter einer Apps-Überschrift enthüllt. Mitte zeigt die Live-Produktvorschau mit der Staffel-Tabelle unter dem Add-to-Cart-Button. Polaris-Stil Admin-Chrome, violetter Akzent auf dem ausgewählten Block. Beziehe dich auf die /docsscreenshot-manifest.md Slot volume-discounts-step-3, um den echten Screen später zu erfassen.
Warum handcodierte Staffel-Tabellen still brechen (die Sammlungs-Falle)
Hier ist der Fehler-Modus, der die meisten frustrierten Forum-Posts generiert, und er ist kein Bug in deinem Tabellen-Markup. Er ist ein Mismatch zwischen wie du denkst, dass der Rabatt scoped ist, und wie Shopify tatsächlich zählt.
Sagen wir, du baust eine handcodierte Tabelle auf einer Esszimmerstuhl-Produktseite: 3 bis 5 Stühle sparen 15 Prozent, 6 bis 9 sparen 18 Prozent, 10 oder mehr sparen 20 Prozent. Du unterstützt es mit einem nativen Shopify-Rabatt scoped zu deiner "Stühle"-Kollektion. Die Tabelle sieht korrekt aus. Dann passieren still zwei Dinge falsch.
Erstens zählen native sammlungs-scoped-Rabatte Gesamteinheiten über jedes Produkt in der Kollektion, nicht Einheiten des einzelnen Stuhls auf der Seite. Ein Käufer kann deine "Kaufe 3"-Staffel auslösen, indem er einen von jedem von drei verschiedenen Stühlen hinzufügt, das ist nicht das, was die Tabelle auf jeder einzelnen Stuhl-Seite impliziert. Die angezeigte Tabelle ist von der Perspektive eines Produkts geschrieben; der Rabatt macht Sammlungs-Mathematik. Sie beschreiben unterschiedliche Angebote.
Zweitens ändert sich die Rabatt-Mitgliedschaft unter dir. Im Moment, in dem du ein neues Produkt zu dieser Kollektion hinzufügst, oder im Moment, in dem ein Produkt herausfällt, verschieben sich die Artikel, die zur Schwelle zählen. Händler haben genau das auf den Foren markiert: Das Hinzufügen eines Produkts zu einer Kollektion ändert still die Rabatt-Logik, und nichts warnt dich. Deine handcodierte Tabelle zeigt immer noch die alten Staffeln. Sie beschreibt nun einen Rabatt, der nicht mehr in der Form existiert, die der Kunde sieht.
Das ist der Kerngrund, warum eine Staffel-Tabelle nicht ein statisches Artefakt sein sollte, das du manuell wartst. Die Tabelle ist eine Ansicht eines Rabatts. Wenn der Rabatt Scope oder Mitgliedschaft ändern kann, ohne die Tabelle zu berühren, werden die zwei abweichen, und die Abweichung ist unsichtbar bis ein Kunde oder deine eigene Test-Bestellung sie aufdeckt. Die Lösung ist strukturell: Pro-Produkt-Staffeln anzeigen aus der gleichen Definition, die der Rabatt nutzt, und auf die Weise zählen, die die Tabelle behauptet zu zählen, pro Produkt und seine Varianten, nicht zusammengefasst über eine ganze Kollektion. Das ist das Zählmodell, das in Pro-Produkt-Volumenrabatte behandelt wird, und es ist der Unterschied zwischen einer Tabelle, die immer wahr ist, und einer, die wahr bis Dienstag ist.
Die SEO-Falle: Rendere niemals Preise als Überschrift-Tags
Das eine ist eine echte, dokumentierte Landmine, und es kommt direkt aus den App-Rezensionen. Ein Händler markierte, dass eine beliebte Rabatt-App ihre On-Page-Preise in Überschrift-Tags renderte, was mehrere konkurrierende H1-Elemente auf jeder Produktseite erzeugte, und der Support lehnte ab, es zu beheben. Das ist keine kosmetische Beschwerde. Es ist eine SEO-Regression, die in das Widget gebacken ist.
Hier ist, warum es zählt. Suchmaschinen nutzen deine Überschriften-Hierarchie, um eine Seite zu verstehen. Das H1 soll der einzelne, primäre Titel der Seite sein, fast immer der Produktname. Der Rest der Überschriften, H2 und H3, beschreiben die Struktur darunter. Wenn ein Rabatt-Widget "6 für 34 Dollar" in ein oder wickelt, weil das ein fauler Weg war, um die Zahl groß und fett aussehen zu lassen, injiziert es Überschriften ohne semantische Bedeutung und verwässert die, die das tun. Mehrere H1s auf einer Seite verwirren das Signal darüber, worum es auf der Seite tatsächlich geht. Preise und "Du sparst"-Figuren sind Daten, keine Dokument-Struktur. Sie gehören in Tabellenzellen, Spans oder Absätze, gestylt mit CSS, niemals in Überschrift-Elemente.
Die richtige Weise, eine Staffel-Tabelle zu rendern, ist langweilig korrektes HTML: ein echtes Wenn du eine Rabatt-App bewertest, ist das eine konkrete Sache, die du vor der Installation überprüfen kannst. Zeige Quellcode auf einer Demo-Produktseite, oder führe es durch deinen Browser SEO- oder Accessibility-Inspector und bestätige das Widget addiert keine Überschrift-Elemente. Das ist ein fünf-Minuten-Test, der dich von einem langsamen, schwer zu diagnostizierenden Ranking-Rückgang bewahrt. Das Fehlen dieses Problems vermarkten ist fair Game, weil so viele Widgets es falsch machen. Eine Produktseiten-Staffel-Tabelle ist klein, aber sie rendert auf deinen höchsten-Intent, höchsten-Traffic-Seiten, also ihre Performance-Kosten verstärkt. Zwei Core Web Vitals Metriken sind die, auf die zu achten ist. Cumulative Layout Shift (CLS) ist die erste. Eine Tabelle, die einen Moment nach dem Rest der Seite poppt, hat gemalt, schubst den Add-to-Cart-Button nach unten und baut Layout-Shift auf. Die Behebung ist die Tabelle serverseitig im Initial-HTML zu rendern, wo möglich, sodass der Platz vom ersten Anstrich reserviert ist, anstatt sie spät mit JavaScript zu injizieren, nachdem die Seite sich setzt. Die Staffel-Tabelle Werte sind zur Render-Zeit bekannt; es gibt keinen Grund, dass sie zuletzt ankommen muss. Largest Contentful Paint (LCP) und das allgemeine Gewicht-Budget sind die Zweite. Ein Widget, das ein schweres JavaScript-Paket, seine eigene Web-Schrift oder ein Chunk Framework-Code lädt, um das zu ziehen, das grundsätzlich eine kleine Tabelle ist, gibt dein Geschwindigkeit-Budget achtlos aus. Shopify Theme-App-Extension-Framework hilft hier: Wenn ein App-Block auf einer Seite vorhanden ist, werden sein Stylesheet und Skript einmal über die Framework-eigenen Tags geladen, und wenn ein Händler mehrere Blöcke hinzufügt, die die gleiche Datei referenzieren, Shopify enthält diese Datei nur einmal pro Seite. Ein guter Staffel-Tabellen-Lean auf das, liefert minimales CSS und JS, und macht die schwere Hebelkraft serverseitig. Das Live-Update-Verhalten verdient auch eine Note. Eine nette Staffel-Tabelle hebt die aktive Staffel hervor, wenn der Käufer die Menge ändert, ohne Seiten-Reload. Diese Interaktion ist billig, wenn es ein paar Zeilen vanilla JavaScript umschalten einer Klasse ist, und teuer, wenn es ein Framework-Re-Render ist. Halte es leicht. Der Punkt der Tabelle ist, mehr Einheiten zu verkaufen, und eine Seite, die langsam zu interagieren ist, verkauft weniger. Lassen Sie uns eine konkrete bauen. Eine Nahrungsergänzungs-Marke verkauft einen Protein-Eimer für 40 Dollar. Sie möchten Lagern auf dem gleichen Eimer belohnen, gezählt pro Produkt über seine Aromen, mit diesen Staffeln: Die Tabelle auf der Produktseite, genau unter dem Add-to-Cart-Button platziert, liest wie das. Die "Du sparst"-Spalte ist das, was überzeugend macht. Ein Käufer, der 6 Eimer hinzufügt, sieht die "6 bis 11"-Reihe als ihre aktive Staffel hervorgehoben, bei 34 Dollar je, spart 48 Dollar gegen das Kaufen von sechs zum vollen Preis. Die Reihe oben und unten bleiben sichtbar, sodass die nächste Staffel ("Nur noch sechs mehr und es fällt auf 32 je") immer in Sicht ist. Dieser sichtbare nächste Schritt ist der Mechanismus. Es ist der gleiche Grund, warum Großhandels-Preisraster immer als Raster gedruckt worden sind. Die zwei Regeln vom Rest dieses Leitfadens gelten beide für diese exakte Tabelle. Erstens, die Werte in der "Preis je"-Spalte müssen die Werte sein, die der Rabatt tatsächlich berechnet, gezählt pro Produkt über des Eimers Aroma-Varianten, nicht zusammengefasst über unverbundene Produkte. Zweitens, keine dieser Zellen darf ein Überschrift-Tag sein. Die 34 Dollar ist eine Tabellenzelle, die gestylt ist, um prominent auszusehen, nicht ein Hier ist die zuverlässige Reihenfolge für die App-Block-Route, die ist, die die meisten Stores nutzen sollten. App-Blöcke erfordern ein JSON-Template-Theme. Wenn du auf einem aktuellen Shopify-Theme bist, qualifizierst du dich fast sicher. Wenn du auf einem Vintage-Theme bist, plane zuerst ein Theme-Update oder nutze einen Liquid-Ansatz in der Zwischenzeit. Setze deine Mengenbruchpunkte im Rabatt selbst: die Bruchpunkte, die Pro-Einheit-Preise oder Prozentsätze und den Zählmodus (Zähle die Varianten dieses Produkts zusammen, nicht die ganze Kollektion). Das ist die einzelne Wahrheitsquelle. Alles, das der Kunde sieht, sollte von hier stammen. Öffne deine Produktvorlage im Theme-Editor, wähle Blöcke in einem Abschnitt hinzufügen, und wähle den Staffel-Tabellen-Block der App. Zieh ihn direkt unter den Add-to-Cart-Button. Weil App-Blöcke die Typography und Farben des Themes erben, sollte es dein Design sofort anpassen; stelle nur Abstände oder Ausrichtung an, wenn der Block diese Einstellungen exponiert. Füge das Produkt zu einem echten Test-Warenkorb bei einer Menge hinzu, die eine Staffel-Grenze überschreitet, zum Beispiel 6 Einheiten, und bestätige, dass der Preis, den die Tabelle zeigte, der Preis beim Checkout ist, einschließlich durch einen beschleunigten Checkout wie Shop Pay. Das ist der Schritt, der Abweichung vor Kunden entdeckt. Zeige die Produktseiten-Quelle und bestätige das Widget addierte keine Überschrift-Tags und schubst den Add-to-Cart-Button nicht herum, während es lud. Ein schneller Pass in einem SEO- oder Accessibility-Inspector bestätigt eine H1, den Produkttitel, mit der Staffel-Tabelle in einer Tabelle oder Liste, nicht in Überschriften. Wenn dein Rabatt gescoped ist, füge ein Produkt aus der relevanten Kollektion oder Gruppe hinzu und entferne es, und überprüfe erneut, dass die Staffel-Tabelle auf deinem Ziel-Produkt immer noch die Staffeln zeigt, die du beabsichtigst. Das ist, wo handgehaltene Tabellen fehlschlagen; ein richtig pro-Produkt-gescoped Angebot nicht. Wenn du lieber nicht eine handcodierte Tabelle wartst, die von deinem Rabatt abweicht, oder ein Widget HTML für stray Überschrift-Tags auditest, das ist das spezifische Problem Stackable wurde gebaut, um zu handhaben, ehrlich und nach Shopify echten Regeln. Installiere Stackable kostenlos und sehe die Produktseiten-Tabelle und den Checkout-Total auf den Cent übereinstimmen auf usestackable.com/pricing. Antworten auf häufige Fragen finden Füge einen Theme-App-Block von einer Rabatt-App im Theme-Editor hinzu und positioniere ihn unter dem Add-to-Cart-Button, oder kodiere die Tabelle manuell in Liquid in deiner Produktvorlage. Der App-Block-Weg erfordert keinen Code und liest in einer gut gebauten App die gleichen Staffel-Werte, die der Checkout nutzt. Die wesentliche Anforderung ist in jedem Fall, dass die angezeigten Preise dem entsprechen, was der Checkout berechnet, und dass die Tabelle keine Überschrift-Tags nutzt. Ja, wenn dein Theme Online Store 2.0 ist und du eine Rabatt-App verwendest, die einen Theme-App-Block liefert. Der Shopify-Theme-Editor ermöglicht es dir, App-Blöcke visuell hinzuzufügen, zu entfernen und umzuordnen, ohne Theme-Code zu bearbeiten. Das manuelle Kodieren einer Tabelle in Liquid erfordert Entwickler-Komfort und fügt laufende Wartung hinzu, weil die Tabelle dann getrennt vom Rabatt ist und manuell synchron gehalten werden muss. Nur wenn sie schlecht gebaut ist. Die echte Gefahr ist ein Widget, das Preise in Überschrift-Tags rendert, was zusätzliche H1- oder H2-Elemente erzeugt und deine Überschriftenstruktur der Seite verwässert. Eine korrekt gebaute Tabelle platziert Preise in Tabellenzellen oder Spans, die mit CSS gestylt sind, und bewahrt einen einzelnen H1 (deinen Produkttitel). Überprüfe jede App, indem du den Quellcode auf einer Demo-Seite anzeigst und bestätigst, dass sie keine Überschrift-Elemente hinzufügt. The team building Stackable, the reliability-first bulk and volume discount app for Shopify. We write about discount stacking, Shopify Functions, and how to run promotions that hold up at checkout. 13 min read 12 min read 9 min read Wir verwenden essenzielle Cookies für den Betrieb dieser Website und, nur mit Ihrer Erlaubnis, Analyse-Cookies, um den Traffic zu verstehen. Lesen Sie unsere Cookie-Richtlinie. (oder eine gestylt Liste), deren Zellen die Mengen und Preise halten, mit visuelem Gewicht angewendet durch CSS, nicht durch Überschrift-Tags. Die Zahlen können so groß und fett aussehen wie dein Designer möchte. Sie dürfen einfach nicht vortäuschen, Seiten-Überschriften zu sein. Shopify eigene Anleitung für Storefront-Widgets im Theme-App-Extension-Framework zeigt die gleiche Richtung, und intern ist die Regel, die wir uns selbst halten, einfach: Storefront-Widgets müssen SEO-sicher sein, ohne injizierte Überschrift-Tags und kein Layout-Shift.
Core Web Vitals: Eine Staffel-Tabelle sollte dir keine Geschwindigkeit kosten
Ausgearbeitetes Beispiel: Eine "Menge, Preis je, Du sparst"-Tabelle
. Folge diesen zwei Regeln und diese Tabelle ist sicher, auf jeder Produktseite im Katalog zu liefern.Wie du es einrichtest, Schritt für Schritt
1. Bestätige, dass dein Theme Online Store 2.0 ist
2. Definiere die Staffeln einmal, im Rabatt
3. Füge den Staffel-Tabellen-App-Block im Theme-Editor hinzu
4. Bestätige, dass die Anzeige die Checkout-Mathematik gleich ist
5. Überprüfe die Überschriftenstruktur und Layout-Stabilität
6. Teste die Sammlungs-Edge-Case
BILD-PLATZHALTER (Bild 3): Die Anzeige und der Checkout stimmen überein
Vorgeschlagene Visualisierung: Eine 16:9 Split-Illustration. Linkes Panel mit dem Label "Produktseite" zeigt die Staffel-Tabelle mit der 6-Einheiten-Reihe hervorgehoben bei $34.00 je. Rechtes Panel mit dem Label "Checkout" zeigt die gleichen 6 Einheiten berechnet bei $34.00 je mit einem grünen Häkchen Badge, das "Gleicher Preis" liest. Ein einzelnes ungebrochenes Ketten-Icon verbindet die zwei Panels. Unten, eine Beschriftungs-Streifen, die "Eine Wahrheitsquelle: Anzeige gleich Checkout." Brand-Farben violett und Gold, flacher Vektor, keine Fotografie.
Laufe das zuverlässig mit Stackable
Die Quintessenz
Verwandte Artikel
Häufig gestellte Fragen
Stackable Team
Related Posts
Buy One, Get the Second 50% Off in Shopify: Der "Do Not Discount First N Quantities"-Trick und seine Grenzen
Shopifys 100-Produkt-Limit bei Buy X Get Y: So führen Sie 3-for-2 über Ihren gesamten Katalog
Shopify ermöglicht jetzt mehrere Produktrabatte auf denselben Artikel (2026): Was hat sich geändert und wie richten Sie es ein