Produktseite
Die Produktseite besteht aus dem Abschnitt Product und seinen Blöcken. Im Theme-Editor können Sie Blöcke neu anordnen, ausblenden oder entfernen. Der Abschnitt fasst bis zu 24 Blöcke.
Abschnittseinstellungen
Gallery
Die Galerie zeigt die Produktmedien mit Miniaturansichten und lädt das erste Bild zuerst.
- Image fit: Fill the frame schneidet auf ein Seitenverhältnis von 4:3 zu, und Kunden können zum vollständigen Bild wechseln. Show the full image fügt Abstand um das Bild hinzu.
- Enable sticky gallery on desktop: Die Galerie bleibt sichtbar, während der Kunde durch den Kaufbereich scrollt.
- Show sticky buy bar on phones: zeigt den Preis und eine Schaltfläche „Add to cart“ unten am Bildschirm, sobald die Hauptschaltfläche aus dem sichtbaren Bereich scrollt. Erscheint nicht auf Bildschirmen, die breiter als 880px sind.
Tab „Fitted on car“: Ein zweiter Galerie-Tab erscheint, wenn das Produkt-Metafeld custom.on_car_images (Liste von Dateien) Bilder enthält. Verwenden Sie ihn für Fotos des am Auto montierten Teils.
Ein Foto pro Ausführung: Wenn ein Kunde eine Variante wählt, wechselt die Galerie zum Bild dieser Variante. Weisen Sie das Variantenbild im Shopify-Adminbereich zu. Bei Optionen mit Farbmustern können Sie den Wert stattdessen in den Alt-Text des Bildes schreiben (zum Beispiel „Gunmetal“).
Blöcke
Hier stehen die Blöcke in der Reihenfolge, die die Demo verwendet.
Breadcrumb
Erscheint über der Galerie als Home / Kollektion / aktuelles Element.
- Current item: SKU (der Produkttitel, wenn es keine SKU gibt) oder Product title.
Subheading
Eine kleine Zeile über dem Produkttitel.
- Text: Product type, Vendor oder First collection.
- Add the series: fügt nach einem Mittelpunkt das Produkt-Metafeld
custom.seriesan, sofern das Produkt eines hat.
Title
Der Produkttitel. Keine Einstellungen.
SKU and stock
- Show SKU.
- Low stock threshold (0–20): zeigt „Low stock“, wenn die Menge bei oder unter dieser Zahl liegt; 0 schaltet die Anzeige aus. Gilt nur für Varianten, deren Bestand Shopify verfolgt und die bei null nicht weiter verkauft werden.
- Show the remaining count with "Low stock".
Short text
Eine kurze Zusammenfassung unter dem Titel.
- Source: Short description metafield oder Description excerpt. Das Metafeld ist
custom.short_description(mehrzeiliger Text). Ist es leer, verwendet Keld den ersten Absatz der Produktbeschreibung (bis zu 40 Wörter).
Price
Zeigt den Preis der gewählten Variante mit Angebots- und Grundpreisen. Daneben steht ein Hinweis aus dem Produkt-Metafeld custom.price_note (einzeiliger Text, zum Beispiel „pro Rad“). „Demo price“ erscheint, solange Theme-Einstellungen › Fitment › Show "Demo fitment" label aktiviert ist.
Variant picker
Zeigt jede Option als Gruppe von Schaltflächen.
- Farbmuster: Optionen, deren Werte Shopify-Farbmuster haben, zeigen einen Farb- oder Bildpunkt. Siehe Farbmuster weiter unten.
- Ausverkauft und nicht verfügbar: Diese Kombinationen erscheinen schraffiert, bleiben aber auswählbar, damit der Kunde sieht, warum die Schaltfläche deaktiviert ist.
- Ohne JavaScript zeigt die Auswahl eine einfache Variantenliste.
Quantity
- Maximum quantity per add to cart (1–99). Mengenregeln an der Variante in Shopify haben Vorrang.
Buy buttons
- Show dynamic checkout buttons: zeigt Shop Pay, PayPal und ähnliche Schaltflächen unter „Add to cart“, wie in Ihren Zahlungseinstellungen eingerichtet.
Ausverkaufte Optionen erhalten keinen Link „Notify me“. Benachrichtigungen bei Wiederverfügbarkeit brauchen eine App; platzieren Sie deren App-Block nach diesem Block.
Complete the kit
Schlägt Teile vor, die zu diesem Produkt passen. Jedes Teil ist ein Kontrollkästchen mit seinem Preis, und eine Schaltfläche legt die gewählte Variante zusammen mit den angehakten Teilen als Gruppe in den Warenkorb.
- Heading, Note (kleiner Text neben der Überschrift, zum Beispiel wie Sie die Zusammenstellung gewählt haben) und Products shown (1–6).
- Die Produkte kommen aus dem Produkt-Metafeld
custom.kit_products(Liste von Produkten). Solange das Metafeld leer ist, erscheint nichts.
Vehicle fitment
Vergleicht die Zuordnungsliste des Produkts mit dem gespeicherten Fahrzeug des Kunden. Der Block hat keine Einstellungen. Seine Zustände sind:
- No vehicle set: bittet den Kunden, ein Fahrzeug festzulegen.
- Listed: Das Fahrzeug steht in der Zuordnungsliste des Produkts.
- Not listed: Das Fahrzeug steht nicht in der Liste.
- Fitment not set: Das Produkt hat keine Zuordnungsdaten.
Der Block gibt nie eine geprüfte Kompatibilität vor. Bei Geschenkgutscheinprodukten erscheint er nicht. Siehe Fahrzeugzuordnung.
Pickup availability
Zeigt, ob die gewählte Variante an Ihren Standorten abgeholt werden kann. Die Abholung vor Ort richten Sie unter Einstellungen › Versand und Zustellung ein.
Collapsible panel
Ein Panel, das sich auf- und zuklappen lässt. Fügen Sie so viele hinzu, wie Sie brauchen.
- Heading.
- Content:
- Custom text: der Text, den Sie in Custom text eingeben.
- Product description.
- Specifications (metafield custom.spec_sheet): eine zweispaltige Tabelle.
- Listed platforms (metafield custom.fitment): die Fahrzeuge, für die das Teil gelistet ist. Zeigt nichts, wenn das Produkt keine Zuordnungsdaten hat.
- Other product metafield: Geben Sie unter Metafield key einen Schlüssel im Namespace custom ein, zum Beispiel
in_the_boxoderfitting_notes. Rich Text, mehrzeiliger Text, einzeiliger Text und Listen mit einzeiligem Text funktionieren; andere Typen werden übersprungen. - Shop policies: Links zu Ihren Versand- und Rückerstattungsrichtlinien.
- Open by default.
Die Demo verwendet sechs Panels: Beschreibung, Spezifikationen, Gelistete Plattformen, Lieferumfang, Montagehinweise sowie Versand und Rücksendungen.
Reviews
Nimmt eine Bewertungs-App auf. App-Blöcke, die direkt nach diesem Block platziert werden, erscheinen darin. Ohne Bewertungs-App erscheint das Panel nicht; es zeigt also nie leere oder erfundene Bewertungen.
- Heading und Open by default.
Custom Liquid und App-Blöcke
- Custom Liquid: fügt dem Kaufbereich Liquid oder HTML hinzu, zum Beispiel das Snippet einer App.
- App-Blöcke: Apps, die Theme-App-Blöcke unterstützen, lassen sich hier hinzufügen.
Farbmuster
Keld zeigt Farbpunkte auf der Produktseite und auf Produktkarten, wenn eine Option mit Shopifys Kategorie-Metafeld Farbe verknüpft ist.
- Öffnen Sie das Produkt im Shopify-Adminbereich und legen Sie eine Kategorie fest, die ein Farbattribut hat (die meisten haben eines).
- Klicken Sie unter Varianten auf die Option (zum Beispiel „Ausführung“).
- Klicken Sie auf das Symbol Metafeld verknüpfen (oben rechts an der Option) und wählen Sie Farbe.
- Legen Sie für jeden Wert einen Farbeintrag an: Label, Farbe (Hex) und Basisfarbe. Klicken Sie auf Fertig und dann auf Speichern.
Einmal angelegte Einträge lassen sich bei anderen Produkten wiederverwenden. Erscheinen die Punkte nach dem Speichern nicht, öffnen Sie die Option, lösen Sie die Verknüpfung, speichern Sie und verknüpfen Sie die Option dann erneut.
Produktkarten zeigen bis zu 6 Punkte, danach „+n“.
Geschenkgutscheine
Geschenkgutscheinprodukte verwenden dieselbe Produktseite. Keld ergänzt:
- Send this as a gift: ein Kontrollkästchen, das E-Mail-Adresse und Namen des Empfängers, eine Nachricht (bis zu 200 Zeichen) und ein Versanddatum einblendet.
- Der Block Vehicle fitment ist bei Geschenkgutscheinprodukten ausgeblendet.
Um ein Geschenkgutscheinprodukt anzulegen, gehen Sie im Shopify-Adminbereich zu Produkte › Geschenkgutscheine › Geschenkgutscheinprodukt hinzufügen und legen Sie die Beträge fest.
Produktkarten
Produktkarten in Kollektionen, in der Suche und in Abschnitten mit vorgestellten Produkten zeigen:
- das erste Bild und beim Überfahren mit der Maus ein zweites, wenn das Produkt eines hat
- die Tags Sold out, Sale (wenn der Vergleichspreis einer Variante über ihrem Preis liegt) und New (Produkte mit dem Tag
New) - die SKU und den Produkttyp, den vollständigen Produktnamen und eine Spezifikationszeile aus
custom.spec_line - den Preis, Farbpunkte oder die Anzahl der Varianten und ein Zuordnungs-Badge, sobald ein Fahrzeug festgelegt ist
- eine Schaltfläche zum schnellen Hinzufügen bei vorrätigen Produkten mit nur einer Variante
Kommen Sie mit Keld nicht weiter? Kontaktieren Sie den Support mit der URL Ihres Shops und der Seite, auf der es passiert.