Powered by Smartsupp

Eigene Integration

Implementierungszeit : 15 min

Integrationsverfahren für den Einsatz auf einer eigenen Lösung:

Die Integration unserer Autovervollständigung in Ihre Plattform ist einfach und verläuft reibungslos. Sie können dies auch ohne Programmierer bewältigen, jedoch ist es die ideale Lösung, wenn Ihr Entwickler unseren Code nur in die Warenkorbseite (Checkout) des E-Shops einfügt.


Damit stellen Sie sicher, dass das Skript nicht unnötig auf Seiten geladen wird, auf denen es nicht benötigt wird, und somit den E-Shop nicht belastet.


Unser Code ist selbstverständlich auf Geschwindigkeit und Leistung optimiert, dennoch empfehlen wir dieses Vorgehen als Best Practice. Wir freuen uns, wenn Sie diese befolgen.



Launify-Administration:

  1. Registrieren Sie sich auf unserer Website app.launify.com und melden Sie sich anschließend in unserer Administration an.
  2. Klicken Sie in unserer Administration auf die Schaltfläche Integration -> Schlüssel erstellen.
  3. Geben Sie den Namen des Schlüssels und die Domains ein, mit denen dieser Schlüssel kommunizieren darf, und klicken Sie auf Speichern.
  4. Wenn Sie bereits einen API-Schlüssel erstellt haben, sehen Sie in der Zeile rechts das Symbol </>, klicken Sie darauf und kopieren Sie den Code, der im Popup-Fenster erscheint.

Nun haben Sie einen API-Schlüssel erstellt, der nur auf den von Ihnen definierten Domains funktioniert, und den Code zum Einfügen in Ihren E-Shop kopiert.


In Ihrer E-Shop-Plattform:

Nun muss der kopierte Code mit dem API-Schlüssel in den <head>-Tag Ihres E-Shops/Ihrer Anwendung eingefügt werden.


  1. Fügen Sie in Ihrem E-Shop unseren Tracking-Code in den Header ein, den Sie im vorherigen Schritt aus unserer Launify-Administration kopiert haben.
  2. Wenn es die Situation erlaubt, bevorzugen wir es, wenn Sie den Code nur in den Bereich einfügen, in dem der Kunde die Lieferadresse ausfüllt. – In diesem Fall kann unser Code direkt unter dem Formular in die HTML-Vorlage eingefügt werden und muss nicht in den <head> eingefügt werden.
  3. Fertig! Damit ist Ihr E-Shop mit unserem Add-on verbunden.


Beispiel unseres Codes

Vergessen Sie nicht, YOUR_API_KEY_HERE durch Ihren API-Schlüssel zu ersetzen und das richtige Land in updateCountry('CZ') einzustellen, falls Sie diesen Code von hier kopieren. Eine Liste der unterstützten Länder finden Sie hier. Der Code kann auf Ihrer Seite minifiziert werden.

<script>
(function(){
function init() {
if(window.Launify) return;
var s = document.createElement("script");
s.src = "https://cdn.launify.com/launify.min.js?t=" + Date.now();
s.async = true;
s.onload = function() {
try {
var launifyInstance = new Launify('YOUR_API_KEY_HERE');
launifyInstance.updateCountry('CZ'); // hier legen Sie das Zielland des E-Shops im ISO-CODE-2 fest
launifyInstance.init();
} catch(e) { console.error(e); }
};
document.head.appendChild(s);
}
if(document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", init);
} else {
init();
}
})();
</script>


Nun müssen also Ihre Formularfelder (Inputs, Outputs) für die Adresseingabe, E-Mails und zum Abhören der Ergebnisse konfiguriert werden.

Mapping

  1. Klicken Sie in unserer Administration auf die Schaltfläche Integration. Scrollen Sie in diesem Bereich nach unten zu „Mapping von Ein- und Ausgängen“.
  2. Standardmäßig ist die erste Mapping-Gruppe bereits vordefiniert. Diese Gruppe können Sie nach Ihren Bedürfnissen anpassen oder weitere hinzufügen. Es gibt keine Begrenzung.
  3. Sie können Formular-Inputs hinzufügen nach: id, name, class, data-attribute


Falls Sie beim Mapping der Inputs Hilfe benötigen, zögern Sie nicht, uns per Chat oder E-Mail zu kontaktieren. Wir übernehmen das Mapping gerne für Sie.