Individualisierung
Der Online-Assistenten kann individuellen Bedürfnissen anpassen werden.
Einleitung
Die Signatur der Initialisierungs-Funktion sieht wie folgt aus:
Lokalleads.init(licenceCode, options);
Es gibt nur 2 Pflichtangaben: licenceCode
und selector
Minimale Konfig - Beispiel
<script type="text/javascript">
const licenceCode = "LL-XYZ123456789";
const options = {
selector: "#meister1"
}
Lokalleads.init(licenceCode, options);
</script>
Konfiguration
Die options
können jedoch durch weiteren Angaben ergänzt werden.
Erweiterte Konfig - Beispiel
<script type="text/javascript">
const licenceCode = "LL-XYZ123456789";
const options = {
selector: "#meister1",
customStyle: {
primaryColor: "#271f84",
}
}
Lokalleads.init(licenceCode, options);
</script>
Layout / Style
customStyle
Attribut | Beschreibung |
---|---|
primaryColor | Primärfarbe (z.B. für den "Weiter"-Button) |
primaryFontColor | Primärfarbe für Schrift |
textColorLight | Texte die weniger präsenz erfordern |
linkColor | Schriftfarbe für Links |
font | Schriftart und -größe |
Ankersprung optimieren
scrollOffset
Wenn der Benutzer im Online-Assistenten auf die nächste Seite wechselt, dann springt der Assistent wieder nach oben. Manche Webseiten haben jedoch ein globales Seiten-Element, welches sich als Overlay über die Seite legt. Mit dem scrollOffset
kann das Ziel des Sprungs für verschiedene Gerätegrößen angepasst werden.
info
Kann positive und negative Werte enthalten. Negative Werte verschieben den Sprung weiter nach oben.
Attribut | Beschreibung |
---|---|
mobile | Offset für Bildschirmgröße mind. 0x550 Pixel |
tablet | Offset für Bildschirmgröße mind. 551x991 Pixel |
desktop | Offset für Bildschirmgröße mind. 992x1199 Pixel |
wideScreen | Offset für Bildschirmgröße mind. 1200x10000 Pixel |
Vollständige Konfiguration - Beispiel
const options = {
selector: "#meister1",
customStyle: {
primaryColor: "#271f84",
primaryFontColor: "#e87918",
textColorLight: "green",
linkColor: "red",
font: "14px Arial"
},
scrollOffset: {
mobile: 0,
tablet: 0,
desktop: 0,
wideScreen: 0
}
}