Recommendations

Clerk.io bietet mehr als 23 verschiedene Arten von Produktlogiken, sodass Sie komplett automatisierte Produkte auf jeder Seite anzeigen können. Dieser Artikel erklärt, wie Sie beginnen, wenn Sie ein Clerk.js-Setup in VTEX verwenden.

Für unsere vollständigen Best Practices lesen Sie diesen Artikel darüber, welche Recommendations verwendet werden sollen.

Slider-Setup #

Recommendations werden mit Elements erstellt, die sich auf ein Design beziehen. Unten finden Sie die grundlegende Anleitung zur Einrichtung eines Elements.

Wenn Sie die Schritte in my.clerk.io > Settings > Setup Guides befolgen, werden die Elements für unsere Best Practices automatisch erstellt.

Design Erstellen #

Recommendations werden standardmäßig als Slider angezeigt. So können Kunden mehr Produkte mit weniger Klicks sehen. Sie können entweder den Design Editor verwenden, um das Design visuell anzupassen, oder Code Designs nutzen.

Ein Design kann für beliebig viele Recommendations-Elemente wiederverwendet werden, die Sie erstellen.

Sie können den Setup Guide unter Recommendations - Create a design for your recommendations elements verwenden, um schnell ein Design zu erstellen, das das gleiche Farbschema und den Stil wie Ihr Webshop hat.

Klicken Sie auf Publish, wenn Sie mit dem Styling zufrieden sind.

Sie können dies später ganz einfach unter Recommendations – Designs ändern, indem Sie auf die Schaltfläche „Bearbeiten“ klicken.

Content Erstellen #

Hier sind alle Einstellungen enthalten, die zur Anzeige der Recommendations verwendet werden und das Element auf Ihrer Website einbetten. Führen Sie diese Schritte für jedes Recommendations-Banner durch, das Sie erstellen möchten.

1. Gehen Sie zu Recommendations > Elements.
2. Klicken Sie auf New Content.
3. Geben Sie einen beschreibenden Namen ein. Wir empfehlen, ihn nach der Seite und der gewünschten Logik zu benennen, z. B. “Home Page / Visitor Recommendations”.
4. Wählen Sie in Content type, die gewünschte Produktlogik aus dem Dropdown-Menü aus. Eine Übersicht aller Produktlogiken finden Sie hier.
5. Wählen Sie in Design das von Ihnen erstellte Design aus dem Dropdown-Menü aus und legen Sie die gewünschte Produktanzahl fest.
6. Klicken Sie auf Save oben auf dem Bildschirm.

Mit dem Setup Guide sehen Sie, auf welchen Seiten Recommendations installiert werden sollten und welche Typen verwendet werden, um unsere Best Practices zu erfüllen. Jeder Schritt des Setup Guide konzentriert sich auf eine bestimmte Seite des Webshops und enthält Informationen zu:

• Warum Recommendations auf der Seite wichtig sind.
• Welche Recommendation-Typen verwendet werden sollen.
• Wo auf der Seite sie platziert werden sollen.

Klicken Sie für jeden Typ von Recommendations, den Sie verwenden möchten, und folgen Sie den Schritten.

Bitte beachten Sie: Wenn Sie nur auf jeden Block von Recommendations klicken, werden diese grün angezeigt, als ob sie installiert wären – das sind sie aber nicht – Sie müssen weiterhin klicken und die Schritte befolgen.

Zur Website hinzufügen #

Um Clerk Recommendations auf Ihrer Website hinzuzufügen, müssen Sie die VTEX-Integration konfigurieren.

1. Fügen Sie in Ihrem Shop-Theme clerkiopartnerdk.integration-vtex 1.x als Theme-PeerDependency in der Datei manifest.json hinzu:

"peerDependencies": {
"clerkiopartnerdk.integration-vtex": "1.x"
}

2. Fügen Sie den Block clerkio_recommendations an beliebiger Stelle in Ihrem Shop ein. Beispiel: in home.json

{
  "store.home": {
    "blocks": [
      "responsive-layout.desktop#homepage",
      "responsive-layout.mobile#homepage"
    ]
  },
  "responsive-layout.desktop#homepage": {
    "children": ["clerkio_recommendations"]
  }
}

3. Gehen Sie zum VTEX Site Editor. Im rechten Seitenmenü wird ein ClerkIO-Block angezeigt. Klicken Sie darauf.

4. Füllen Sie die erforderlichen Informationen im Block aus:
   • Block Class Name: Einfügen einer eindeutigen Kennung für den Block innerhalb der Seite, auf der er verwendet wird, z. B. clerk-product-page-alternatives
   • Template Name: Geben Sie die von Clerk für den zuvor erstellten Content bereitgestellte ID ein.
   • Product Logic: Stimmen Sie die Recommendation-Logik auf diejenige ab, die im zuvor erstellten Content bei Clerk angegeben ist. Die verfügbaren Produktlogiken sind:

Seiten #

Nachfolgend sind die spezifischen Seiten aufgeführt, auf denen Sie Recommendations platzieren und welche Typen Sie verwenden sollten, um unseren Best Practices zu folgen.

Homepage #

1. Erstellen Sie in my.clerk.io 3 Elements mit folgenden Logiken:
   • Visitor Recommendations
   • Bestsellers
   • Hot Products
2. Fügen Sie den Block clerkio_recommendations Ihrem Homepage-Layout im VTEX Site Editor hinzu.
3. Konfigurieren Sie jeden Block mit dem entsprechenden Template Name und Product Logic.

Kategorie-Seite #

1. Erstellen Sie in my.clerk.io ein Element mit der Logik Bestsellers In Category.
2. Fügen Sie den Block clerkio_recommendations zum Layout Ihrer Kategorie-Seite hinzu.
3. Konfigurieren Sie den Block mit dem Template Name und stellen Sie Product Logic passend zu Ihrem Content ein.

Produktseite #

1. Erstellen Sie in my.clerk.io 2 Elements mit folgenden Logiken:
   • Best Alternative Products
   • Best Cross-Sell Products
2. Fügen Sie den Block clerkio_recommendations zum Layout Ihrer Produktseite hinzu.
3. Konfigurieren Sie jeden Block mit dem entsprechenden Template Name und Product Logic.

Add-To-Basket Schritt #

1. Erstellen Sie in my.clerk.io ein Element mit der Logik Best Cross-Sell Products.
2. Geben Sie ihm den Namen “Add-To-Basket / Others Also Bought”. Dies ist wichtig, damit der Einbettungscode korrekt funktioniert.
3. Klicken Sie auf Save oben auf der Seite.
4. Fügen Sie den Block clerkio_recommendations zu Ihrem Add-To-Basket-Schritt/-Seite hinzu.
5. Konfigurieren Sie den Block mit dem Template Name und Product Logic.

Warenkorb-Seite #

1. Erstellen Sie in my.clerk.io ein Element mit der Logik Best Cross-Sell Products.
2. Fügen Sie den Block clerkio_recommendations zum Layout Ihrer Warenkorb-Seite hinzu.
3. Konfigurieren Sie den Block mit dem Template Name und Product Logic.

Exit Intent #

1. Erstellen Sie in my.clerk.io ein Element mit der Logik Visitor Recommendations.
2. Fügen Sie den Block clerkio_recommendations zu Ihrem globalen Layout hinzu.
3. Konfigurieren Sie den Block mit dem Template Name und Product Logic und stellen Sie ein, dass er beim Exit-Intent ausgelöst wird.

Startvorlagen #

Wenn Sie Code Designs verwenden möchten, helfen Ihnen diese Vorlagen beim Einstieg.

Slider-Code #

Diese Vorlage zeigt einen Standard-Slider mit verschiedenen Produktinformationen an, den Sie nach Ihren Wünschen anpassen können.