Wie kann ich das Design des Tabs für die Lasche ändern?

Obwohl die Version 9.408 eigentlich nur ein Bugfix-Release ohne grössere zusätzliche Funktionalitäten ist, gibt es doch eine Sache, über die es zu schreiben lohnt. So kann man den Tab des Laschenchats jetzt sehr tiefgreifend über CSS anpassen.

Dazu muss man eine CSS-Datei irgendwo auf seinem Webspace hinterlegen. Wenn die yalst-Einbindung per HTTPS gemacht wird, was sie sollte, dementsprechend auch unter HTTPS.

Die entsprechende URL wird dann im HTML-Codegenerator in der Administration unter „Einbindung“ – „HTML-Codegenerator“ – „1. Live-Support-Einbindung in Ihre Webseite“:

an der entsprechenden Stelle eingetragen:

Hier natürlich die URL zur der CSS-Datei auf dem eigenen Webspace hineinschreiben. Der Einbindungscode bekommt dann einen neuen Parameter tab_button_css_url: \x26tab_button_css_url=https%3A%2F%2Fwww.example.com%2Fcustom_tab.css

Ausgehend vom „normalen“ Tab:

kann man relativ einfach kann man nun die Textgröße, die Fontfamilie und den Fontstyle anpassen:

 

und den doppelten Rahmen entfernen:

 

Beides vereint sieht dann so aus:

Aber um zu zeigen, was sonst noch möglich ist, wird hier anhand einer CSS-Datei veranschaulicht, dass man durchaus in der Lage ist, auch ein eigenes Bild in die Lasche zu integrieren. Dabei wird der eigentliche Tab nur noch als Container benutzt und der Container mit dem Text wird der neue Tab. Das before-Element, welches vorher die zweite Linie enthielt, wird dabei als Container für das neue Bild benutzt. Dieses muss natürlich auch per HTTPS irgendwo auf Ihrem Webspace liegen.

Hier ist das CSS mit vielen Kommentaren:

 

Und hier ist dann das Resultat:

Mit ein bisschen Geduld lässt sich also der Tab grundsätzlich umstylen.

Zweitsprache in yalst – ein kurzes HowTo

Grundsätzlich gibt es in yalst eine Hauptsprache. Diese ist entweder Deutsch oder Englisch und ist neben der Sprache des Chats auf Besucherseite auch die Sprache für das Frontend in der Operator-Konsole („Arbeitsplatz der Agenten“) und der Administration. Neben dieser Hauptsprache kann man pro Zugang optional eine Zweitsprache auswählen.

Die Auswahl der Zweitsprache kann dabei in der Adminstration unter „Konfiguration“ – „Einstellungen“ – „Sonstiges“ erfolgen. Hierbei können Sie dann – je nach Hauptsprache – Deutsch, Englisch, Spanisch, Französisch und Italienisch auswählen.

Neben dem DropDown für die Zweitsprache finden Sie den Button „Textausgaben für die Zweitsprache“, der auf eine entsprechende Unterseite mit einer Vielzahl von Texten für die Zweitsprache leitet. Hier sind diese Texte für z. B. eine Zweitsprache „Englisch“ definiert.

 

Wenn Sie diese Einstellungen vorgenommen haben, wird Ihnen in den Chatfenstern (hier: der Chat direkt in der Seite) von yalst eine Umschaltung auf die Zweitsprache (hier: Spanisch) angeboten:

 

Damit ist es schon fast geschafft. Wenn man den Chat auf der Webseite direkt in der Zweitsprache anbieten will, kann man das im HTML-Codegenerator wählen. Diesen finden Sie  in der Administration unter „Einbindung“ – „HTML-Codegenerator“ – „1. Live-Support-Einbindung in Ihre Webseite“.

Dort wählen Sie als Sprache die entsprechende Zweitsprache aus:

 

Im Einbindungscode taucht dann ein spezieller Parameter „\x26lang=2“ auf und der Chat läuft initial in der Zweitsprache z.B. in Spanisch. Die Umschaltmöglichkeit bleibt dabei natürlich bestehen.

Um die Texte im eigentlichen Tab auf der Webseite anzupassen, die dann ja auch in der Zweitsprache angezeigt werden sollten, müssen Sie diese ändern („Text bei „online“, Text bei „busy“, Text bei „offline“). Auch das lässt sich im HTML-Codegenerator einstellen:

 

Diese Texte werden dann, im Gegensatz zu den meisten anderen Texten in yalst, direkt in den Einbindungscode integriert. Das ermöglicht Ihnen, auf verschiedenen Seite unterschiedliche Texte zu verwenden oder die Besucher auf zweisprachigen Webseiten mit demselben Chat, aber in unterschiedlichen Sprachen zu empfangen.

Done!