Customize
Erstellt für:
- Admin
Wenn Sie das Modul Produktempfehlungen installieren, erstellt Adobe Commerce das ProductRecommendationsLayout. Dieses Verzeichnis enthält Vorlagendateien, die Sie anpassen können, um zu ändern, wie die Empfehlungen auf Ihrer Storefront angezeigt werden. Insbesondere können Sie die folgende Vorlage ändern oder überschreiben:
<your theme>/Magento_ProductRecommendationsLayout/web/template/recommendations.html
Weitere Informationen zum Ändern von Vorlagendateien finden Sie unter Vorlagenanpassung im Frontend-Entwicklerhandbuch.
Wenn Sie die recommendations.html ändern, müssen Sie die folgenden Tags in der Datei beibehalten, um sicherzustellen, dass Adobe Commerce Empfehlungsmetriken aus Ihrer Storefront erfassen kann:
| Tag | Verwenden Sie |
|---|---|
<div data-bind="attr : {'data-unit-id' : unitId }"...</div> | Sammelt Ansichtsereignisse. |
<a data-bind="attr : {'data-sku' : sku, 'data-unit-id'}"...</a> | Sammelt Klickereignisse. Hinweis: Wenn Sie Anker-Tags hinzufügen, müssen Sie diese Attribute einschließen. |
Zusätzlich zur recommendations.html-Datei enthält das ProductRecommendationsLayout-Verzeichnis die folgenden Unterverzeichnisse:
| Verzeichnis | Zweck |
|---|---|
layout | Enthält *.xml Dateien für jeden Seitentyp |
templates | Enthält Dateien, die die Skripte zum Abrufen und Rendern aufrufen |
web/js | Enthält die JavaScript-Dateien, die Empfehlungen für Ihren Store abrufen und rendern |
web/template | Enthält die Vorlage für das magento/product-recommendations |
Positionierung der Empfehlungseinheit
Wenn Sie Empfehlung erstellen geben Sie den Speicherort an, an dem sie auf der Seite angezeigt wird. Eine Empfehlungseinheit kann entweder oben oder unten im Hauptinhalts-Container platziert werden. Sie können diese Platzierung jedoch anpassen. Wenn Sie einen Inhaltstyp „Page Builder-Empfehlung“ erstellen, verwenden Sie die Page Builder-Tools, um die Empfehlungseinheit auf der Seite zu positionieren. Bearbeiten Sie für alle anderen Seitentypen die *.xml, die beim Erstellen der Empfehlung generiert werden.
-
Wechseln Sie in das
layoutVerzeichnis :cd `<your theme>/Magento_ProductRecommendationsLayout/layout`In der folgenden Tabelle sind die in diesem Verzeichnis vorhandenen XML-Dateien aufgeführt:
DateinameSeitecatalog_category_view.xmlKategoriecatalog_product_view.xmlProduktdetailscheckout_cart_index.xmlWarenkorbcheckout_onepage_success.xmlCheckoutcms_index_index.xmlStartseite
NOTEDie Dateinamen imlayoutkönnen unterschiedlich sein, wenn Ihr Store Erweiterungen von Drittanbietern verwendet. -
Ändern Sie die
catalog_product_view.xmlso, dass die Empfehlungseinheit nach dem Produktbild auf der Produktdetailseite angezeigt wird. Sehen Sie sich vor dem Anpassen dieser XML-Datei die Datei an und lernen Sie die Abschnitte kennen, die Sie ändern müssen:<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <referenceBlock name="page.wrapper"> <block class="Magento\Framework\View\Element\Template" before="-" name="product_recommendations_fetcher" template="Magento_ProductRecommendationsStorefront::fetcher.phtml" /> </referenceBlock> <body> <referenceBlock name="main.content"> <block class="Magento\ProductRecommendationsStorefront\Block\Renderer" after="-" name="product_recommendations_product_below_content" template="Magento_ProductRecommendationsStorefront::renderer.phtml"> <arguments> <argument name="pagePlacement" xsi:type="string">below-main-content</argument> </arguments> </block> </referenceBlock> </body> </page>Im obigen Ausschnitt zeigt der
main.contentReferenzblock an, dass die Empfehlungseinheit relativ zu diesem Element platziert wird. Ihrblock-Element enthält dasafter="-"-Attribut, das angibt, dass die Empfehlungseinheit auf der Seite nach dem Hauptinhaltsblock angezeigt wird. -
Ändern wir diese Datei, indem wir einen anderen Inhaltsbaustein angeben.
Ändern Sie die
namedes Referenzblocks vonmain.contentinproduct.info.media.<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <referenceBlock name="page.wrapper"> <block class="Magento\Framework\View\Element\Template" before="-" name="product_recommendations_fetcher" template="Magento_ProductRecommendationsStorefront::fetcher.phtml" /> </referenceBlock> <body> <referenceBlock name="product.info.media"> <block class="Magento\ProductRecommendationsStorefront\Block\Renderer" after="-" name="product_recommendations_product_below_content" template="Magento_ProductRecommendationsStorefront::renderer.phtml"> <arguments> <argument name="pagePlacement" xsi:type="string">below-main-content</argument> </arguments> </block> </referenceBlock> </body> </page>Durch diese Änderung wird Ihre Empfehlungseinheit nach dem Produktbild auf der Produktdetailseite angezeigt. Wenn die Empfehlungseinheit vor dem
product.info.mediaangezeigt werden soll, ändern Sie dasafter="-"Attribut inbefore="-". DaspagePlacementArgument ist ein internes Argument, das nicht geändert werden sollte.
Weitere Informationen Blocktypen auf der Seite findenunter „Layout - Übersicht .
Benutzerdefinierte Produktattribute
Entwickler benötigen häufig Zugriff auf benutzerdefinierte Produktattributwerte in Recommendations-Einheiten auf Storefronts, damit sie auf der Grundlage dieser Attribute visuelle Abwandlungen zu Produkten hinzufügen können.
Wenn Ihr Geschäft beispielsweise Bio-Produkte verkauft, können Sie ein benutzerdefiniertes Attribut auf diesen Produkten haben, das sie als Organic = Yes kennzeichnet. Möglicherweise benötigen Sie Zugriff auf diesen Attributwert in der Storefront, damit Sie diesen Produkten eine besondere visuelle Behandlung bieten können, wenn sie in Recommendations angezeigt werden. Ebenso können Sie durch den Zugriff auf diese benutzerdefinierten Produktattributwerte Produkte kennzeichnen oder die benutzerdefinierte Logik in der Präsentationsebene Ihrer Site steuern.
Um sicherzustellen, dass beim Rendern der Empfehlungseinheit auf der Seite ein benutzerdefiniertes Produktattribut verfügbar ist, legen Sie die Used in Product Listing Eigenschaft auf der Seite ""Admin auf Yes fest.
Wenn diese Eigenschaft festgelegt ist, enthält die JSON-Payload ein attributes-Objekt, das ein Array von Attributcodes und -werten enthält. Sie können dann einen benutzerdefinierten Storefront-Stil anwenden, der auf diesen Attributwerten basiert, z. B. das Hinzufügen spezieller visueller Behandlungen oder Abzeichen wie zuvor erwähnt.
NOTE