FAQ

Stoßen Sie auf Probleme mit Ihrer PrestaShop-Integration? Diese FAQ behandelt die häufigsten Probleme und deren Lösungen – von Formatters bis zu Synchronisierungsfehlern.

Verwendung von Formatters #

Clerk.js ermöglicht es Ihnen, eigene JavaScript-Funktionen zu schreiben, die Ihren Designs neue Funktionalitäten hinzufügen.

Formatters können auf zwei Arten hinzugefügt werden:

• Über my.clerk.io > Developers > Formatters, wobei jeder Formatter als eigener Eintrag erstellt werden kann.

• Als Konfiguration für Clerk.js im tracking-script, das auf allen Seiten eingefügt wird und wo mehrere Formatters gleichzeitig hinzugefügt werden können.

Für PrestaShop enthält diese Datei das tracking-script:

modules->clerk->views->templates->hook->clerk_js.tpl

Beispiel-Formatter #

Ein Beispiel sehen Sie unten. Beachten Sie, dass dies Clerk V2 (neueste Version) ist:

<!-- Start of Clerk.io E-commerce Personalisation tool - www.clerk.io -->
<script type="text/javascript">
  (function(w,d){
    var e=d.createElement('script');e.type='text/javascript';e.async=true;
    e.src='https://cdn.clerk.io/clerk.js';
    var s=d.getElementsByTagName('script')[0];s.parentNode.insertBefore(e,s);
    w.__clerk_q=w.__clerk_q||[];w.Clerk=w.Clerk||function(){ w.__clerk_q.push(arguments) };
  })(window,document);

  Clerk('config', {
        key: '{$clerk_public_key}',
        collect_email: {$clerk_datasync_collect_emails},
        language: '{$language}',
        formatters: {
             log_price: function(price) {
             console.log(price);
          }
      },
    });
</script>
<!-- End of Clerk.io E-commerce Personalisation tool - www.clerk.io -->

Mehrere Formatters #

Sie können beliebig viele Formatters schreiben, getrennt durch ein Komma:

formatters: {
  log_price: function(price) {
    console.log(price);
  },
  calculate_discount: function(price, special_price) {
    return price - special_price;
  },
  substring: function(text) {
    var short_string = text.substring(0, 20);
    return short_string;
  }
}

Verwendung in Designs #

Nachdem Sie Ihre Formatters erstellt haben, können Sie sie in Ihren Designs mit folgender Syntax verwenden:

{% raw %}{{ price | log_price }} {{ price | calculate_discount | special_price }}{% endraw %}

So können Sie jede gewünschte Funktionalität in Ihren Designs umsetzen.

HTTP-Authentifizierung #

HTTP-Authentifizierung wird oft auf Staging-Seiten verwendet, um unerwünschte Besucher zu vermeiden.

Dies blockiert den Clerk Importer und zeigt einen 401 Unauthorized-Fehler im Sync-Log an.

Sie können dies beheben, indem Sie die Anmeldedaten in die Import-URL einfügen.

Aktualisieren Sie in my.clerk.io > Data > Configuration Ihre Import-URL wie folgt:

https://USER:PASS@www.ewoksRus.com

Häufige Sync-Fehler #

Hinweis: Wir empfehlen, das Modul stets auf die neueste Version zu aktualisieren, um alle aktuellen Funktionen von Clerk zu erhalten.

Beim Importieren von Daten mit dem PrestaShop-Modul von Clerk ist der Server Ihres Webshops dafür verantwortlich, Produkt-, Kategorie- und Verkaufsdaten an Clerk zu senden.

In manchen Fällen kann jedoch die Serverkonfiguration den Zugriff des Importers auf die Daten blockieren, was einen Fehler bei der Data Sync verursacht.

Nachfolgend finden Sie die häufigsten Fehler und deren Behebung.

401 Unauthorized #

Dieser Fehler tritt auf, wenn Ihr Webshop oder Ihre Entwicklungsumgebung HTTP-Authentifizierung erfordert.

Er löst sich, indem Sie Benutzername und Passwort als Teil der Import-URL einfügen:

http://username:password@prestashop.clerk.io/clerk/api/store/1

403 Forbidden #

Dieser Fehler tritt auf, wenn Ihr Server den Importer blockiert.

In den meisten Fällen müssen Sie einfach die IP-Adresse des Importers auf die Whitelist setzen, damit dieser Zugriff erhält.

Die aktuellste IP-Adresse finden Sie hier.

Überprüfen Sie außerdem, ob Ihr Public Key, Private Key und Ihre Import-URL für den Store innerhalb von my.clerk.io korrekt sind.

In manchen Fällen wird dieser Fehler auch angezeigt, wenn Sie verschiedene Sprachdomains nutzen, z. B. http://webshop.com/it.

In diesem Fall geben Sie die komplette, sprachspezifische Domain, die Sie synchronisieren möchten, in der Import-URL an.

Was tun, wenn die IP bereits auf der Whitelist steht, aber der Fehler weiterhin auftritt?

Es gibt einige Fälle, in denen Sie die Importer-IP-Adresse zwar auf die Whitelist gesetzt haben, der Fehler aber dennoch erscheint.

In diesen Fällen empfehlen wir, folgende Bereiche zu prüfen:

• Der Authentifizierungsteil des Bodys wird vielleicht durch den Shop-Server aus der Anfrage entfernt.

• Rate Limit des Servers in Bezug auf Cloudflare.

• Überprüfen Sie, ob https in der Importer-URL enthalten ist.

404 Not Found #

Dieser Fehler tritt auf, wenn der Importer den Link, der Daten vom Webshop sendet, nicht erreichen kann.

Meistens passiert dies, weil das Modul entweder:

• überhaupt nicht installiert ist

• ein Cache dazu führt, dass der Link nicht initialisiert wird

Stellen Sie zuerst sicher, dass Sie das Modul korrekt installiert haben.

Leeren Sie außerdem den Cache Ihres Webshops, bevor Sie einen neuen Import testen.

429 Too Many Requests #

Dieser Fehler tritt auf, wenn Ihr Server dem Importer den Zugriff aufgrund zu vieler eingehender Anfragen verweigert.

Sie können das Problem lösen, indem Sie das Anfrage-Limit Ihres Servers erhöhen oder die Page Size in my.clerk.io > Data > Configuration auf einen höheren Wert setzen. Eine größere Page Size sorgt dafür, dass der Importer weniger, dafür größere Anfragen sendet.

Wenn Sie den Hoster Byte.nl verwenden, tritt dieser Fehler beim Importer in der Regel wegen deren Rate Limiter auf. Kontaktieren Sie in diesem Fall Byte.nl, und bitten Sie darum, den User-Agent des Importers “clerk” auf die Whitelist zu setzen.

500 Internal Server Error #

Dieser Fehler bedeutet, dass Ihr Server auf einen internen Fehler gestoßen ist und nicht näher spezifizieren kann, was passiert ist.

Prüfen Sie in diesen Fällen Ihr Server-Log, um herauszufinden, welches Prozess abgestürzt ist und warum.

Meistens handelt es sich einfach um ein Produkt mit einem ungültigen Attribut oder eine Funktion, die im Webshop falsch aufgerufen wird.

Wenn Sie die Facebook Pixel App installiert haben, ist bekannt, dass diese einen 500er-Fehler verursachen kann.

Versuchen Sie, die App zu deaktivieren und eine neue Synchronisation durchzuführen. Wenn es dann funktioniert, lassen Sie die App deaktiviert und kopieren Sie das Facebook Pixel manuell in Ihre Hauptdesign-Datei.

Sie können auch versuchen, den Debug-Modus in PrestaShop zu aktivieren. Dann wird bei einem 500-Fehler die genaue Fehlermeldung ausgegeben.

Aktivieren Sie den Debug-Modus IMMER per FTP, um zu vermeiden, dass Sie möglicherweise aus dem Admin-Panel von PrestaShop ausgesperrt werden. So funktioniert es per FTP.

503 Service Unavailable #

Dieser Fehler ist meist temporär und tritt auf, wenn der Server zu beschäftigt ist, um die Anfrage zu bearbeiten.

Versuchen Sie es später erneut.

Tritt das Problem weiterhin auf, bedeutet dies vermutlich, dass der Server mit Prozessen überlastet und kurz vor der maximalen Kapazität ist.

Überprüfen Sie die Server-Auslastung, um dies zu erkennen.

520 Unknown Error #

In der Regel wird dieser Fehler von Cloudflare zurückgegeben und tritt häufig aufgrund eines Flaschenhalses in PrestaShop auf, der Probleme bei größeren Page Sizes verursacht.

Um ihn zu beheben, setzen Sie die Page Size auf 50 und führen Sie eine neue Synchronisation durch.

Ungültige Antwort #

Dieser Fehler wird oft durch das Facebook Pixel Modul verursacht, das ein Pixel am Anfang aller Dateien in PrestaShop einfügt.

Dies führt häufig dazu, dass die Data Sync fehlschlägt, da das Pixel mit den Daten interferiert, die Clerk von PrestaShop erhalten soll.

Die Behebung dieses Problems ist recht einfach — Sie müssen lediglich eine kleine Anpassung in pspixel.php vornehmen, der Datei, die das Pixel erzeugt.

Oft findet sich diese Datei in einem der folgenden 4 Pfade:

• /modules/pspixel/pspixel.php

• /modules/alcapixel/alcapixel.php

• /modules/facebookpixel/facebookpixel.php

• /modules/canonicalseo/canonicalseo.php

Fügen Sie in der Datei, ungefähr bei Zeile 196, folgende Codezeile in die public function hookHeader($params) ein:

if (strpos($_SERVER['REQUEST_URI'], '/module/clerk/') !== false) {
    return;
}

Um die neueren Data-Syncs zu unterstützen:

if (Tools::getValue('module') == 'clerk') {
    return;
}

Speichern Sie die bearbeitete pspixel.php-Datei nach dem Hinzufügen der obigen Bedingung.

Dadurch wird das Pixel speziell aus den Links entfernt, die Clerk nutzt, um Daten von PrestaShop zu importieren.

Deaktivieren von CCC #

CCC (Concatenate, Combine and Cache) ist eine integrierte PrestaShop-Funktionalität, mit der Sie die Anzahl der Requests Ihrer Vorlage reduzieren und diese dann cachen können.

Manchmal kann diese Funktion die Data Sync beeinträchtigen und sie blockieren.

Wenn Sie Data Sync-Fehler erleben, öffnen Sie bitte Ihr PrestaShop-Backend und gehen Sie zu:

Wechseln Sie dann zum Bereich:

Deaktivieren Sie dort alle Unterfunktionen, speichern Sie, leeren Sie den PrestaShop-Cache – und fertig!

P.S: Sie können das gleiche Komprimierungsniveau – und damit die Seitenlade-Performance – auch mit einem CDN oder einem spezialisierten PrestaShop-Modul erreichen, das die gleiche Komprimierung und Kombination der Bibliotheken durchführt.

Upgrade auf Clerk.js 2 #

Clerk.js 2 ist eine schnellere und flexiblere Version unserer JavaScript-Bibliothek.

Es vereinfacht die Installation von Clerk in jedem Webshop.

Da sich jedoch die beiden Versionen in bestimmten Punkten unterscheiden, müssen Sie folgende Schritte befolgen, um erfolgreich upzugraden.

Die zwei Hauptunterschiede in Clerk.js 2 bestehen darin, dass die Designs in my.clerk.io die Liquid-Templating-Sprache verwenden, aber auch einfach mit dem Design Editor erstellt werden können.

Designs erstellen #

Da Clerk.js 2 einen anderen Ansatz für Designs verfolgt, müssen Sie neue Designs anlegen.

Sie können Ihre Clerk.js 2 Designs auf zwei Arten erstellen:

• Verwenden Sie den intuitiven Design Editor, um neue Designs zu erstellen, wie in den folgenden Punkten beschrieben.

• Konvertieren Sie Ihre alten Designs. Erfahren Sie hier, wie das geht

Design-Editor-Option #

1. Gehen Sie zu my.clerk.io > Recommendations/Search > Designs > New Design.

2. Geben Sie dem Design auf der folgenden Seite einen Namen (wir empfehlen, “V2” hinzuzufügen, damit klar ist, dass Sie Clerk.js 2 verwenden).

3. Wählen Sie den Design-Typ aus.

4. Klicken Sie auf Create Design, wenn Sie fertig sind.

5. Klicken Sie im Design Editor auf eines der vorhandenen Elemente wie Name, Bild, Button usw., um es zu bearbeiten, oder ziehen Sie neue Elemente per Drag-&-Drop in das Design, um weitere Produktinformationen hinzuzufügen.

6. Klicken Sie auf Save Design, wenn Sie fertig sind, und fahren Sie mit Schritt 2 im Leitfaden fort.

7. Gehen Sie zu Recommendations/Search > Elements und stellen Sie Ihr Clerk-Element auf Ihr neues Design um.

8. Klicken Sie auf Update Element. Die Elemente werden vorübergehend nicht im Webshop angezeigt, bis Sie mit Schritt 2 fertig sind. Wählen Sie für alle zu aktualisierenden Elemente das neue Design.

Jetzt sind Sie bereit, auf Clerk.js 2 umzusteigen.

Modul updaten #

WARNUNG: Denken Sie daran, Backups aller modifizierten Dateien anzulegen, da diese überschrieben werden.

Starten Sie, indem Sie die neueste Version unter folgendem Link herunterladen:

https://github.com/clerkio/clerk-prestashop/releases/latest

Loggen Sie sich dann in Ihr PrestaShop-Admin ein und gehen Sie zu Modules And Services > Modules And Services.

Auf dieser Seite führen Sie Folgendes aus:

1. Klicken Sie auf Add New Module.

2. Klicken Sie auf Datei auswählen und laden Sie die clerk.zip hoch, die Sie gerade heruntergeladen haben.

3. Klicken Sie auf Upload this module.

PrestaShop zeigt anschließend eine Erfolgsmeldung an, die bestätigt, dass Ihr Modul jetzt aktualisiert wurde.

Nun haben Sie die neueste Version von Clerk für PrestaShop installiert und Clerk.js 2 läuft in Ihrem Webshop!

Die vollständige Dokumentation zu Clerk.js 2 finden Sie hier:

https://docs.clerk.io/docs/clerkjs-quick-start

Umgang mit require.js #

Diese Anleitung gilt nur für die Verwendung bis zu v.4.4.1 der PrestaShop-Clerk-Erweiterung.

In einigen Setups verhindert Require.js, dass Clerk.js geladen wird, so dass keine Slider oder Suchergebnisse angezeigt werden.

In diesem Fall erscheint folgender Fehler in Ihrer Konsole:

Uncaught ReferenceError: Clerk is not defined

Es gibt zwei Möglichkeiten, mit Require.js umzugehen. Beide Ansätze erfordern Änderungen am tracking-script in folgender Datei:

modules->clerk->views->hook->visitor_tracking.tpl

In Require.js einbinden #

Der beste Ansatz ist, Require.js dazu zu bringen, Clerk zu erkennen.

Fügen Sie require(['clerk'], function() {}); am Ende des Tracking-Skripts ein.

Require.js ignorieren #

Falls die obige Lösung nicht funktioniert, kann Require.js ignoriert werden.

Fügen Sie window.__clerk_ignore_requirejs = true; ganz oben im Tracking-Skript ein.

Nachdem Sie eine der beiden Methoden umgesetzt haben, ist Require.js jetzt mit Clerk kompatibel.