Plugin

Konfigurieren Sie Ihre WooCommerce-Plugin-Einstellungen, verwalten Sie Datenabgleichsoptionen und passen Sie Such-, Recommendations- und Protokollierungsfunktionen an. Dieser Leitfaden deckt alle verfügbaren Einstellungen und Optionen ab.

Sobald das Plugin erfolgreich installiert wurde, erscheint es im Seitenmenü Ihres WooCommerce-Backends:

Allgemein #

Hier finden Sie eine Erklärung zu jeder Option im Bereich General:

• Plugin Version: Die aktuell installierte Version des Clerk-Plugins. Hier finden Sie das neueste Release.

• Public Key: Geben Sie Ihren Public key, ein, den Sie in my.clerk.io unter Developers > API keys finden.

• Private Key: Geben Sie Ihren Private Key ein, erstellt in my.clerk.io unter Developers > API keys.

• Language: Wählen Sie die korrekte Sprache der Domain aus.

• Import URL: Die von Clerk genutzte URL, um Daten zu synchronisieren. Fügen Sie diese in Ihrem my.clerk.io-Konto unter Data > Configuration im Feld Store URL hinzu.

• Use Legacy Authentication: Aktivieren Sie diese Option, wenn Sie reguläre WooCommerce-API-Schlüssel (consumer key und consumer secret) verwenden. Für die meisten Setups ist dies erforderlich, um Datenabgleichsanfragen korrekt zu authentifizieren.

Datenabgleich: Produkte #

In diesem Abschnitt können Sie anpassen, wie Produktdaten mit Clerk synchronisiert werden. Nachfolgend eine Erklärung zu jeder Option:

• Use Real-Time Updates: Synchronisieren Sie Ihre Daten in Echtzeit mit Clerk, sobald Änderungen in WooCommerce vorgenommen werden.

• Include Out Of Stock Products:** Wenn diese Option aktiviert ist, importiert Clerk Produkte, die als „Nicht auf Lager“ geführt werden.

• Image Size: Wählen Sie die Bildgröße, die in Clerk importiert wird. Falls Sie unsicher sind, wählen Sie large und verwalten Sie die Größe anschließend direkt in Clerk Design.

• Additional Fields: Hier können Sie eine kommagetrennte Liste mit zusätzlichen Produktdaten-Attributen angeben, die Sie von Ihrem WooCommerce-Shop zu Clerk synchronisieren möchten.

• Strip/Trim Split Attributes: Wenn „Strip“ deaktiviert ist, werden alle Leerzeichen in Zeichenketten entfernt (z.B. ’ Option 1’ = ‘Option1’). Ist „Trim“ aktiviert, werden nur führende und nachgestellte Leerzeichen entfernt, innere Leerzeichen bleiben erhalten (z.B. ‘Option 1’ = ‘Option 1’).

• Additional Fields Raw: Geben Sie alle Attribute an, die Sie bereits zu Additional Fields hinzugefügt haben, um diese Werte exakt wie eingegeben zu importieren. So werden Kommas nicht als Trenner bei der Übertragung verwendet.

Datenabgleich: Seiten #

In diesem Abschnitt können Sie anpassen, wie Seitendaten mit Clerk synchronisiert werden. Nachfolgend eine Erklärung zu jeder Option:

• Use Real-Time Updates (Pages): um Ihre Seiten in Echtzeit mit Clerk zu synchronisieren, sobald Änderungen in WooCommerce vorgenommen werden.

• Include Pages: Ist diese Option aktiviert, importiert Clerk alle Seiten, die unter WooCommerce > Pages > All Pages. enthalten sind.

• Page Additional Fields: Hier angegebene Attribut-Slugs werden für jede Seite importiert.

• Page Additional Types: Synchronisieren Sie zusätzliche Seitentypen, einschließlich benutzerdefinierter. Geben Sie eine kommagetrennte Liste an, um mehrere Typen hinzuzufügen.

Datenabgleich: Kunden #

In diesem Abschnitt können Sie anpassen, wie Kundendaten mit Clerk synchronisiert werden. Nachfolgend eine Erklärung zu jeder Option:

• Include Customers: Wenn aktiviert, werden Kunden zu Clerk importiert.

• Collect Basket: Das Aktivieren dieser Option erlaubt Clerk Informationen über Produkte zu sammeln, die in den Warenkorb gelegt wurden. Zum Beispiel sollten Sie diese Option aktivieren, wenn Sie den Trigger „Abandoned Basket“ verwenden.

• Collect Emails: Das Aktivieren dieser Option ermöglicht Clerk, die E-Mail-Adressen von Kunden aus WooCommerce zu sammeln und zu importieren.

• Collect Emails Signup Message: Wenn Sie hier einen Text eintragen, wird beim Checkout eine Checkbox angezeigt, bei der die Email in my.clerk.io abonniert wird. „Collect Emails“ muss aktiviert sein, um diese Funktion zu nutzen. Wenn das Feld leer bleibt, ist die Checkbox nicht aktiv.

• Extra Customers Fields: Eine kommagetrennte Liste mit weiteren Attributen für Kundendaten, die während der Synchronisierung eingeschlossen werden sollen.

Datenabgleich: Bestellungen #

Hier gibt es nur eine Option: Disable Order Synchronization, welche das Senden von Bestellungen an Clerk während des täglichen Datenabgleichs deaktiviert, wenn aktiv.

Clerk sammelt diese trotzdem in Echtzeit von Besuchern.

Live-Search-Einstellungen #

In diesem Abschnitt können Sie die Live Search anpassen und aktivieren. Nachfolgend eine Erklärung zu jeder Option:

• Enabled: Aktiviert Ihre Clerk Live Search.

• Include Suggestions/ Categories / Pages: Damit können Sie steuern, ob Clerk passende Suggestions, Kategorien oder Seiten finden soll, die in der Live Search angezeigt werden.

• Number of Suggestions / Categories / Pages: Damit legen Sie fest, wie viele mögliche Treffer pro Kategorie angezeigt werden.

• Pages type: Wählen Sie, welcher Seitentyp im Dropdown angezeigt wird, z.B. Blog-Posts, CMS-Seiten oder Alle.

• Dropdown Positioning: Wählen Sie die Position der Live Search-Dropdown-Ergebnisse.

• Live Search Input Selector: Geben Sie den input selector ein; dies ist eine Klasse oder ID für das Eingabefeld der Suche.

• Live Search Form Selector: Geben Sie den form selector ein; dies ist eine Klasse oder ID für das Suchformular.

• Element: Geben Sie den Namen Ihres Live Search Elements ein. Dieser wird im Element embed code als data template name aufgeführt, data-template= YOUR-ELEMENT-NAME. Meistens “live-search”, z.B.:

<span class="clerk" 
  data-template="@live-search"  
  data-instant-search="INSERT_SEARCH_INPUT_CSS_SELECTOR_HERE" 
  data-instant-search-suggestions="6" 
  data-instant-search-categories="6" 
  data-instant-search-pages="6" 
  data-instant-search-positioning="right">
 </span>

Sucheinstellungen #

In diesem Abschnitt können Sie die Suchseite anpassen und aktivieren. Nachfolgend eine Erklärung zu jeder Option:

• Enabled: Aktiviert Ihre Clerk Search Page.

• Search Page: Wählen Sie die CMS-Seite, die als Ziel für die Clerk Search verwendet werden soll.

• Include Categories / Pages: Damit können Sie steuern, ob Clerk passende Kategorien oder Seiten findet, die auf der Suchseite angezeigt werden.

• Number of Categories / Pages: Damit legen Sie fest, wie viele mögliche Treffer pro Typ angezeigt werden.

• Pages type: Wählen Sie, welcher Seitentyp im Dropdown angezeigt wird, z.B. Blog-Posts, CMS-Seiten oder Alle.

• Element: Geben Sie den Namen Ihres Search Page Elements aus dem Element embed code in my.clerk.io ein. Üblicherweise “search-page”.

• No results text: Geben Sie den Text ein, der auf der Suchseite angezeigt werden soll, wenn keine Suchergebnisse gefunden werden.

• Load more button text: Geben Sie den Text für den „Mehr laden“-Button ein.

Facettierte Navigation #

• Enabled: Aktiviert Ihre Clerk Facets auf der Suchseite.

• Add Custom Attribute: Geben Sie hier den Namen eines Attributs ein, das Sie in Ihre Facetten aufnehmen möchten, und klicken Sie dann auf „Hinzufügen“.

• Facet Attributes: Nach dem Hinzufügen erscheint das Attribut in diesem Bereich. Hier können Sie dessen display title festlegen, die Position in der Facettenliste bestimmen und das Show-Kästchen aktivieren, um es in den Facetten zu integrieren.

• Design: Geben Sie die ID des Facetten-Designs ein. Sie finden diese unter my.clerk.io > Search > Design.

Powerstep-Einstellungen #

In diesem Abschnitt können Sie den Powerstep nach dem Hinzufügen eines Produkts zum Warenkorb anpassen und aktivieren. Nachfolgend eine Erklärung zu jeder Option:

• Enabled: Aktiviert den Clerk Powerstep.

• Powerstep Type: Wählen Sie den Typ des Powerstep aus dem Dropdown-Menü, z.B. „page“ oder „popup“.

• Powerstep Page: Wählen Sie die CMS-Seite, die als Ziel für den Clerk Powerstep verwendet werden soll.

• Contents: Geben Sie den Namen Ihres Power Step Elements aus dem Element embed code in my.clerk.io ein.

• Filter Duplicates: Die Aktivierung stellt sicher, dass jedes Banner nur komplett unterschiedliche Produkte zeigt.

• Enable Custom Texts: Bei Aktivierung können Sie eigene Texte im Powerstep hinterlegen.

• Back Button: Geben Sie den Text ein, der auf Ihrem Zurück-Button angezeigt werden soll, damit Nutzer zur vorherigen Seite zurückkehren können.

• Cart Button: Geben Sie einen Text für den Button ein, der zur Warenkorb-Seite weiterleitet.

• Product Title: Geben Sie einen Text für den Powerstep-Titel ein.

• Keep Add To Cart Params: Das Aktivieren dieser Option sorgt dafür, dass beim Weiterleiten zur Powerstep-Seite die Parameter zum Hinzufügen zum Warenkorb erhalten bleiben. Dadurch bleiben gewählte Produktdetails während des Prozesses bestehen.

Exit-Intent-Einstellungen #

In diesem Abschnitt können Sie das Exit Intent anpassen und aktivieren.

Ein Exit Intent ist eine Art Popup, das erscheint, wenn ein Nutzer im Begriff ist, die Website zu verlassen. Nachfolgend eine Erläuterung zu jeder Option:

• Enabled: Aktivieren Sie Ihr Clerk Exit Intent-Element, indem Sie dieses Kästchen markieren.

• Element: Geben Sie den Namen des Exit Intent Elements ein, das Sie für Ihren Shop erstellt haben. Üblicherweise „exit-content“.

Kategorie, Produkt, Warenkorb #

In diesem Abschnitt können Sie die Recommendations für Kategorie-, Produkt- und Warenkorbseiten anpassen und aktivieren. Nachfolgend eine Erklärung zu jeder Option:

• Enabled: Aktiviert Ihre Clerk Category, Product und Cart Recommendations-Elemente.

• Element: Geben Sie den Namen des Elements ein, das Sie in my.clerk.io für Ihren Shop erstellt haben. Es ist meistens bereits ausgefüllt.

• Filter Duplicates: Die Aktivierung stellt sicher, dass jedes Banner nur komplett unterschiedliche Produkte zeigt.

• Defer Injection: Nur bei Product Settings: Wenn aktiviert, werden die Recommendations auf der Produktseite erst nach der vollständigen Seitendarstellung eingefügt.

• Category / Product / Cart ID Shortcode: Mit diesen Shortcodes können Sie Clerk embedcodes ganz einfach einfügen, falls Sie deren Platzierung mit Editor-Plugins wie WPBakery und Elementor anpassen möchten. Zum Beispiel:

<span class="clerk"
   data-template="product-page-alternatives"
   data-products="[[clerk_product_id]]">
</span>

Zusätzliche Skripte #

In diesem Abschnitt können Sie zusätzliche JS-Skripte hinzufügen und aktivieren. Nachfolgend eine Erklärung zu jeder Option:

• Enabled: Aktiviert das zusätzliche Skript, das im folgenden Feld eingefügt wurde.

• JS Code: Falls aktiviert, wird das hier eingegebene Skript zusammen mit Clerk.js ausgeführt.

Logging #

In diesem Abschnitt können Sie die Protokollierung von Fehlern und Warnungen von Clerk aktivieren und anpassen. Nachfolgend eine Erklärung zu jeder Option:

• Enabled: Aktiviert die Logging-Funktion.

• Log level: Hier können Sie den gewünschten Protokollierungs-Typ auswählen.

  • Only Errors: Protokolliert alle Fehler, die das ordnungsgemäße Funktionieren des Moduls verhindern.

  • Error + Warn: Protokolliert außerdem Warnungen, die das Modul zwar nicht stoppen, aber trotzdem behoben werden sollten.

  • Error + Warn + Debug: Protokolliert alles, womit das Modul interagiert. Dies sollte nicht auf einem Live-Webshop aktiviert werden, da es die Website verlangsamt.

• Log to: Es wird alles zu My.Clerk.io in Developers > Logs. protokolliert.

Aktualisierung #

Best Practice: Legen Sie vor jedem Upgrade unbedingt Backups der geänderten Dateien an, um bei Bedarf frühere Versionen wiederherstellen zu können.

Falls Sie eine Version vor 2.0.0 benutzen, wird das Upgrade Ihre Designs unterbrechen, da Clerk.js 2 verwendet wird.

Wenn Sie eine ältere Version nutzen, folgen Sie stattdessen dieser Anleitung.

Das Upgrade des Plugins kann direkt aus dem WooCommerce-Backend heraus durchgeführt werden. Gehen Sie dazu folgendermaßen vor:

1. Gehen Sie zuerst zu Plugin > Installed Plugins und suchen nach Clerk.

2. Klicken Sie auf Update Now:

Wenn Sie bereits die neueste Version haben, wird dieser Button einfach Active anzeigen.