Prestashop

FAQ

Lösungen für häufige Fragen und Probleme bei der Verwendung von Clerk mit PrestaShop

Haben Sie Probleme mit Ihrer PrestaShop-Integration? Diese FAQ behandelt die häufigsten Probleme und deren Lösungen, von Formatierern bis zu Synchronisierungsfehlern.

Verwendung von Formatierern #

Clerk.js ermöglicht es Ihnen, benutzerdefinierte JavaScript-Funktionen zu schreiben, die Ihrer Designs neue Funktionalität hinzufügen.

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

Über my.clerk.io > Developers > Formatters, wo jeder Formatierer als separater Eintrag erstellt werden kann.
Als Konfiguration für Clerk.js, im tracking-script, das auf allen Seiten eingefügt wird, wobei mehrere Formatierer 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 ist unten zu sehen. Bitte beachten Sie, dass es sich hierbei um Clerk V2 (neueste Version) handelt:

<!-- 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 Formatierer #

Sie können beliebig viele Formatierer schreiben, getrennt durch Kommas:

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 Formatierer erstellt haben, können Sie diese in Ihren Designs mit folgender Syntax verwenden:

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

Dadurch können Sie jede gewünschte Funktionalität in Ihren Designs abbilden.

HTTP-Authentifizierung #

HTTP-Authentifizierung wird häufig auf Staging-Seiten eingesetzt, um unerwünschte Besucher abzuhalten.

Dadurch wird der Clerk-Importer blockiert und im Sync-Log ein 401 Unauthorized-Fehler angezeigt.

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

In my.clerk.io > Data > Configuration aktualisieren Sie Ihre Import-URL wie folgt:

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

Häufige Synchronisierungsfehler #

Hinweis: Wir empfehlen, das Modul immer 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 Ihr Webshop-Server dafür verantwortlich, Produkt-, Kategorien- und Verkaufsdaten an Clerk zu senden.

In manchen Fällen kann jedoch die Serverkonfiguration den Zugriff des Imports auf die Daten blockieren und einen Fehler in der Data Sync verursachen.

Im Folgenden finden Sie eine Liste der häufigsten Fehler und deren Behebung.

401 Unauthorized #

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

Dies wird behoben, 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 Zugriff des Importers blockiert.

In den meisten Fällen müssen Sie lediglich die IP-Adresse des Importers whitelisten, um ihm Zugriff zu gewähren.

Die aktuelle IP-Adresse finden Sie hier.

Prüfen Sie außerdem, ob Ihr public key, private key und import URL für den Shop, mit dem Sie in my.clerk.io arbeiten, korrekt sind.

In manchen Fällen wird dieser Fehler auch angezeigt, wenn Sie unterschiedliche Sprach-Domains verwenden, wie z.B. http://webshop.com/it.

Stellen Sie in diesem Fall sicher, dass Sie die vollständige Domain, die Sie synchronisieren möchten, angeben:

Was tun, wenn ich bereits alles auf die Whitelist gesetzt habe, aber der gleiche Fehler weiterhin auftritt?

Es gibt einige Fälle, in denen Sie die IP-Adresse des Importers bereits auf die Whitelist gesetzt haben, aber der Fehler weiterhin besteht.

Wir empfehlen in diesen Situationen, folgende Aspekte zu prüfen:

Der Authentifizierungs-Teil des Bodys könnte durch den Server des Shops aus der Anfrage entfernt werden.
Serverseitige Ratenbegrenzungen im Zusammenhang mit Cloudflare.
Überprüfen Sie nochmals, ob die Importer-URL https enthält.

404 Not Found #

Dieser Fehler tritt auf, wenn der Importer den Link, der die Daten vom Webshop überträgt, nicht erreichen konnte.

Meistens passiert dies, weil das Modul entweder:

gar nicht installiert ist
ein Cache verursacht, dass der Link nicht initialisiert wird

Stellen Sie zunächst sicher, dass Sie das Modul korrekt installiert haben.

Leeren Sie anschließend den Cache Ihres Webshops, bevor Sie einen neuen Import versuchen.

429 Too Many Requests #

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

Sie können dies beheben, indem Sie das request limit für Ihren Server erhöhen oder in my.clerk.io > Data > Configuration den Page Size Wert höher einstellen, sodass der Importer weniger, dafür aber größere Anfragen stellt:

Wenn Sie den Hosting-Anbieter Byte.nl verwenden, gibt der Importer aufgrund ihrer Ratenbegrenzung häufig diesen Fehler zurück. In diesem Fall kontaktieren Sie Byte.nl und bitten Sie darum, die User-Agent “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 angeben konnte, welcher Fehler aufgetreten ist.

In diesen Fällen sollten Sie Ihr Server Log prüfen, um herauszufinden, welcher Prozess abgestürzt ist und warum.

In den meisten Fällen ist dies auf ein Produkt mit einem ungültigen Attribut oder eine nicht korrekt aufgerufene Funktion im Webshop zurückzuführen.

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

Deaktivieren Sie die App testweise und führen Sie einen neuen Sync durch. Wenn es dann funktioniert, lassen Sie die App deaktiviert und kopieren Sie das Facebook Pixel manuell in Ihre Haupt-Theme-Datei.

Sie können in PrestaShop auch Debug Mode aktivieren, wodurch die genaue Fehlermeldung bei einem 500er Fehler angezeigt wird.

IMMER Debug Mode per FTP aktivieren, um zu vermeiden, dass Sie womöglich vom PrestaShop-Admin-Panel ausgesperrt werden. Hier erfahren Sie wie es per FTP geht.

503 Service Unavailable #

Dieser Fehler ist normalerweise temporär und wird verursacht, weil der Server zu beschäftigt ist, um die Anfrage auszuführen.

Versuchen Sie es später erneut.

Falls das Problem weiterhin auftritt, könnte das bedeuten, dass der Server mit Prozessen überlastet ist und an seine Kapazitätsgrenze stößt.

Überprüfen Sie die Serverlast, um dies festzustellen.

520 Unknown Error #

Dieser Fehler wird meist von Cloudflare zurückgegeben und tritt häufig auf, weil in PrestaShop bei höheren Page Sizes ein Flaschenhals entsteht.

Um dies zu beheben, stellen Sie Ihren Page Size auf 50 und führen Sie einen neuen Sync durch:

Ungültige Antwort #

Dieser Fehler tritt häufig auf, wenn das Facebook Pixel Modul verwendet wird, welches ein Pixel am Anfang aller Dateien in PrestaShop einfügt.

Dies führt oft dazu, dass die Data Sync fehlschlägt, weil das Pixel die Daten stört, die Clerk von PrestaShop erhalten soll.

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

Oft finden Sie diese 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, ca. bei Zeile 196, folgende Zeile in die public function hookHeader($params) ein:

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

Für die Unterstützung des neuen Data-Syncs:

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

Am Ende sollte die Datei so aussehen:

Dadurch wird das Pixel gezielt von den Links entfernt, die Clerk zum Import von Daten aus PrestaShop verwendet.

Deaktivierung von CCC #

CCC (Concatenate, Combine und Cache) ist eine eingebaute PrestaShop-Funktion, die es ermöglicht, die Anzahl der Anfragen Ihrer Vorlage zu reduzieren und diese dann zu cachen.

Diese Funktionalität kann manchmal unsere Data Sync stören und blockieren.

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

Advanced Parameters > Performance

Gehen Sie dann zum Abschnitt:

CCC (Combine, Compress and Cache)

Deaktivieren Sie alle Teilfunktionen, speichern Sie, leeren Sie den PrestaShop-Cache und freuen Sie sich!

P.S: Sie können denselben Grad der Datenkomprimierung — und damit Ladezeitenoptimierung — auch durch die Nutzung eines CDN oder eines dedizierten PrestaShop-Moduls erreichen, das die gleiche Kompression und Kombination der Bibliotheken durchführt.

Upgrade auf Clerk.js 2 #

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

Es erleichtert die Installation von Clerk auf jedem Webshop.

Da die beiden Versionen jedoch leicht unterschiedlich funktionieren, müssen Sie diese Schritte befolgen, um ein erfolgreiches Upgrade durchzuführen.

Die beiden Hauptunterschiede in Clerk.js 2 sind, dass die Designs in my.clerk.io die Liquid Template-Sprache verwenden, aber sie können auch ganz einfach mit dem Design Editor erstellt werden.

Designs erstellen #

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

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

Verwenden Sie den benutzerfreundlichen Design Editor, um neue Designs zu erstellen, wie in den folgenden Schritten beschrieben.
Konvertieren Sie Ihre alten Designs. Folgen Sie dieser Anleitung, um zu sehen, wie das geht.

Design Editor Option #

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

Geben Sie im nächsten Bildschirm Ihrem Design einen Name (es empfiehlt sich, “V2” hinzuzufügen, damit offensichtlich ist, dass Sie Clerk.js 2 verwenden).
Wählen Sie den Design-Typ aus.
Wenn Sie fertig sind, klicken Sie auf Create Design.

Im Design Editor können Sie bestehende Elemente wie Name, Bild, Button usw. anklicken, um sie zu bearbeiten oder per Drag-and-Drop neue Elemente zum Design hinzufügen, um mehr Produktinformationen anzuzeigen.
Klicken Sie auf Save Design, wenn Sie fertig sind, und gehen Sie zu Schritt 2 in der Anleitung.

Gehen Sie zu Recommendations/Search > Elements und ändern Sie Ihr Clerk Element, sodass es Ihr neues Design verwendet.
Klicken Sie auf Update Element. Dadurch werden diese vorübergehend nicht mehr in Ihrem Webshop angezeigt, bis Sie mit Schritt 2 fertig sind. Wählen Sie das neue Design für alle zu aktualisierenden Elemente aus.

Sie sind jetzt bereit, auf Clerk.js 2 umzuschalten.

Modul aktualisieren #

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

Laden Sie zunächst die neueste Version von diesem Link herunter:

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 gehen Sie wie folgt vor:

Klicken Sie Add New Module.
Klicken Sie Choose a file und laden Sie die clerk.zip Datei hoch, die Sie gerade heruntergeladen haben.
Klicken Sie Upload this module.

PrestaShop zeigt Ihnen nun eine Erfolgsmeldung an und bestätigt, dass Ihr Modul aktualisiert wurde.

Nun ist die neueste Clerk-Version für PrestaShop installiert und Clerk.js 2 läuft auf Ihrem Webshop!

Die vollständige Dokumentation für Clerk.js 2 finden Sie hier:

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

Umgang mit require.js #

Diese Anleitung gilt nur bis zu v.4.4.1 der PrestaShop Clerk-Erweiterung.

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

In diesem Fall wird folgender Fehler in Ihrer Konsole angezeigt:

Uncaught ReferenceError: Clerk is not defined

Es gibt zwei Möglichkeiten, Require.js zu handhaben. 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, zu versuchen, dass Require.js Clerk erkennt.

Dazu fügen Sie am Ende des Tracking-Scripts require(['clerk'], function() {}); ein:

Require.js ignorieren #

Wenn die obige Lösung nicht funktioniert, ist es möglich, Require.js zu ignorieren.

Fügen Sie dazu window.__clerk_ignore_requirejs = true; am Anfang des Tracking-Scripts ein:

Nachdem Sie eine dieser Methoden verwendet haben, ist Require.js nun mit Clerk kompatibel.

Diese Seite wurde von einer hilfreichen KI übersetzt, daher kann es zu Sprachfehlern kommen. Vielen Dank für Ihr Verständnis.