Preis
Verwenden Sie diesen Block, um Produktpreise klar darzustellen und ihnen im Produktdetailbereich die richtige visuelle Priorität zu geben. Er eignet sich am besten, wenn der Preis leicht erfassbar bleiben soll, mit optionaler Hervorhebung von Rabatten und unterstützendem Richtlinientext in der Nähe. Einen umfassenderen Überblick darüber, wie Blöcke funktionieren, finden Sie in der Shopify-Dokumentation zu Abschnitten und Blöcken
Grundeinstellungen
Abschnitt betitelt „Grundeinstellungen“Die Haupteinstellungen steuern, wie präsent der Preis im Produktinformationsbereich wirkt. Die Textgröße verändert die visuelle Hierarchie, während Textfarbe und Farbe des Sale-Preises Ihnen helfen, reguläre Preise von reduzierten Preisen zu unterscheiden.
Wählen Sie eine Größe, die den Preis auffällig macht, ohne die Produktdetails in der Nähe zu überlagern. Bei den Farben sollten Sie zuerst auf gute Lesbarkeit achten und die Sale-Farbe dann nur dort zur Hervorhebung einsetzen, wo Rabatte sich abheben sollen.
Sie können mit dem Preis auch Hinweise zu Versand- und Steuerrichtlinien anzeigen. Das ist hilfreich, wenn Käufer frühzeitig zusätzlichen Kostenkontext sehen sollen, funktioniert aber am besten, wenn Ihr Richtlinientext klar und vollständig ist.
Zeigen Sie Hinweise zu Versand- und Steuerrichtlinien nur an, wenn diese Richtlinien aktuell und für Kundinnen und Kunden bereit sind. Unklarer Richtlinientext kann den Preisbereich weniger vertrauenswürdig wirken lassen.
Standard-Block-Einstellungen
Abschnitt betitelt „Standard-Block-Einstellungen“Sichtbarkeitseinstellungen
Abschnitt betitelt „Sichtbarkeitseinstellungen“Die Sichtbarkeitseinstellungen steuern, ob dieser Block auf Desktop, Mobilgeräten oder auf beiden angezeigt wird. Das ist nützlich, wenn Sie unterschiedliche Produktinformations-Layouts für kleinere und größere Bildschirme erstellen. Weitere Informationen zum Verwalten von Blöcken im Editor finden Sie in der Shopify-Dokumentation zum Anpassen von Abschnitten
Wenn Sie den Block auf einem Gerät ausblenden, stellen Sie sicher, dass der Preis in diesem Layout trotzdem an anderer Stelle klar angezeigt wird. Mehr zu den gemeinsamen Sichtbarkeitseinstellungen erfahren Sie hier.
Nutzungshinweise
Abschnitt betitelt „Nutzungshinweise“- Klare Hierarchie festlegen. Verwenden Sie eine Textgröße, die dem Preis im Verhältnis zum Titel, zu Badges und zu Kaufaktionen genügend Gewicht gibt.
- Halten Sie nahe gelegene Details nachrangig, damit der Preis am schnellsten zu erfassen bleibt.
- Rabatte sorgfältig hervorheben. Verwenden Sie die Sale-Farbe, um auf reduzierte Preise aufmerksam zu machen, ohne die Lesbarkeit zu beeinträchtigen oder mit dem Seitendesign zu kollidieren.
- Halten Sie den regulären Preis gut genug lesbar, um ihn mit dem Sale-Preis vergleichen zu können.
- Richtlinientext gezielt anzeigen. Aktivieren Sie Hinweise zu Versand- und Steuerrichtlinien nur, wenn dieser zusätzliche Kontext hilft, Unsicherheit zu verringern.
- Stellen Sie sicher, dass der Wortlaut vollständig und aktuell ist, bevor Sie sich im Preisbereich darauf verlassen.
- Beide Geräte prüfen. Wenn Sie die Sichtbarkeit ändern, bestätigen Sie, dass der Preis auf Desktop und Mobilgeräten weiterhin leicht zu finden ist.
- Wenn Sie den Block auf einem Gerät ausblenden, sollte das Layout den Preis an anderer Stelle trotzdem klar darstellen.
- Erwarten Sie, dass sich der Produktkontext auf die Anzeige für Kundinnen und Kunden auswirkt. Die Preisanzeige kann je nach ausgewählten Varianten, Menge, Verfügbarkeit und konfigurierten Commerce-Aktionen variieren.
- Testen Sie einige Produktzustände, damit Sie wissen, dass der Preisbereich auch dann noch sinnvoll ist, wenn sich Optionen oder Verfügbarkeit ändern.
- Verwenden Sie eine zurückhaltende Gestaltung, wenn Sie ein gemeinsames Fallback-Verhalten wünschen. Leere, transparente oder standardmäßige Werte überlassen den Preisbereich in der Regel dem umgebenden Design.
- Verwenden Sie explizite Farben oder stärkere visuelle Überschreibungen nur, wenn Sie den Preisblock deutlicher abheben möchten.