Produktkacheln als fertiges HTML ausliefern

Berechnen Sie Produktkacheln mit dem vorhandenen Snippet-Vorlagen-Editor vor und liefern Sie das fertige HTML direkt mit der ersten Shop-Seite aus. Die erste Darstellung benötigt dann keinen Katalog-, Preis- oder Verfügbarkeitsaufruf im Browser.

Nutzen Sie diese Variante für anonyme Listen, Kategorien und Vergleiche. Wenn Ihr Shop kundenspezifische Preise oder eine genaue Verfügbarkeit anzeigen muss, ergänzen Sie nach dem initialen Rendern eine optionale API-Abfrage.

Voraussetzungen

Die Produktvarianten sind für den gewünschten Vertriebskanal und die Sprache veröffentlicht.
Die Shop-Seite verwendet die bestehende Site-Komponente productCatalogSnippets.
Sie besitzen die Berechtigung eines Tenant Owners, um Snippet-Vorlagen zu ändern.

Vorhandene Produktkachel bearbeiten

Öffnen Sie PIM > Ausspielung > Snippet-Vorlagen.
Öffnen Sie die bereits verwendete Produktkachel. Legen Sie keinen zweiten Renderer und keine parallele Vorlage für denselben Ausgabeort an.
Pflegen Sie HTML und bei Bedarf Lua weiterhin in den bestehenden Tabs.
Verwenden Sie für den anonymen Standardpreis zum Beispiel {{ .price_display }}.
Verwenden Sie für den groben Status bei Menge 1 zum Beispiel {{ .purchase_availability.label }}. Der boolesche Wert purchase_availability.can_attempt_purchase eignet sich für Bedingungen.
Prüfen Sie die Kachel im Preview-Tab mit einer realen Variante, Sprache und einem Vertriebskanal.

Der statische Verfügbarkeitsstatus berücksichtigt dauerhaften physischen Bestand. Aktive oder ausstehende Warenkorbreservierungen fließen bewusst nicht ein. Warenkorb und Checkout prüfen Preis und Kaufbarkeit weiterhin live.

Rebuild-Auslöser wählen

Öffnen Sie im Detailbereich Automatische Rebuilds und wählen Sie nur die fachlichen Änderungen, die das Markup verwendet:

Auslöser	Wählen, wenn die Vorlage …
Anonymer Standardpreis	`price_display`, `price_amount`, `price_currency` oder `public_price` ausgibt
Statische Kaufverfügbarkeit	`purchase_availability` ausgibt oder davon Klassen und Aktionen ableitet

Die Liste enthält nur vom Produkt registrierte Auslöser. Sie können keine freien Event-Namen eintragen. Preisänderungen, Preis-Zeitgrenzen und dauerhafte Bestandswechsel bauen anschließend nur die Vorlagen neu, die den jeweiligen Auslöser gewählt haben. Ein unveränderter fachlicher Fingerprint erzeugt kein neues HTML und keine Cache-Invalidierung.

Änderungen an HTML, Lua, Scope oder Produktinhalt bleiben normale Lebenszyklus-Rebuilds. Die Auswahl schaltet diese Rebuilds nicht ab.

Shop-Seite serverseitig anbinden

Konfigurieren Sie productCatalogSnippets mit dem Namen der vorhandenen Produktkachel und dem gewünschten Katalogfilter. Die Komponente setzt bereits gebaute HTML-Artefakte serverseitig ein. Sie berechnet im Seitenrequest weder Preis noch Verfügbarkeit neu.

Prüfen Sie die ausgelieferte Seite im Browser:

Laden Sie die Seite mit deaktiviertem JavaScript.
Kontrollieren Sie, dass alle Produktkacheln, Preise und statischen Verfügbarkeitslabels sichtbar sind.
Kontrollieren Sie im Netzwerkprotokoll, dass die erste Darstellung keine Catalog-, Summary-, Pricing- oder Availability-Abfrage benötigt.
Ändern Sie einen Standardpreis oder dauerhaften physischen Bestand und prüfen Sie nach dem Rebuild die aktualisierte Kachel.

Genauere Daten optional nachladen

Eine optionale Storefront-Erweiterung darf nach dem initialen Rendern den öffentlichen Pricing-/Availability-Vertrag aufrufen. Verwenden Sie diesen Weg für kundenspezifische Preise, andere Mengen, Einheiten oder genaue Verfügbarkeit. Ersetzen Sie das statische HTML nur nach einer erfolgreichen Antwort. Bei Timeout oder API-Fehler bleibt die bereits sichtbare Kachel stehen.

Nächste Schritte

Entwickeln Sie das ViewModel und defensives Markup unter Snippet-Vorlagen entwickeln.
Konfigurieren Sie die serverseitige Produktliste unter Webseiten umsetzen.
Prüfen Sie Public Readiness und fehlende Artefakte in der PIM-Diagnose.