Deutsch DE
Zu Leadcontact
Als Markdown öffnen Der Text der Seite ohne Formatierung In ChatGPT öffnen Eine Frage zu dieser Seite stellen In Claude öffnen Eine Frage zu dieser Seite stellen

Widget erstellen und einrichten

Ein Widget erstellen

  1. Öffnen Sie das Projekt und wählen Sie „Widgets“ im Menü.
  2. Klicken Sie auf „Erstellen“.

Das Widget wird sofort erstellt, ohne Formular, und öffnet sich im Baukasten. Es hat bereits die Überschrift „Hallo!“ und die Beschreibung „Kontaktieren Sie uns über einen der folgenden Kanäle:“. Links gibt es noch keine — fügen Sie mindestens einen hinzu, sonst lässt sich das Widget nicht speichern.

Liste der Widgets

Im Bereich „Widgets“ des Projekts sind alle seine Widgets gesammelt. Als Name des Widgets in der Liste dient seine Überschrift.

  • Ansicht. Der Umschalter rechts zeigt die Widgets als „Liste“ oder als „Kacheln“. Auf einer Kachel sehen Sie das verkleinerte Widget und die Symbole seiner Links; gibt es keine Links, steht dort „Keine Kanäle verbunden“.
  • Reihenfolge. Widgets werden am Symbol links verschoben. Die Reihenfolge gilt für alle Mitglieder des Projekts.

Im Menü „⋯“ rechts:

  • „Symbol“ — ein Bild des Widgets für das Konto und den Kopf des Chats auf der Website hochladen.
  • „Kopie erstellen“ — ein Widget mit denselben Texten, Links, Banner, Farben und Domains erstellen. Die Überschrift der Kopie erhält den Zusatz „(Kopie)“.
  • „Verschieben nach ...“ — das Widget in ein anderes Ihrer Projekte verschieben. Der Punkt ist nur für den Eigentümer des Projekts sichtbar.
  • „Löschen“ — das Widget löschen. Auf den Websites, auf denen sein Code steht, wird es nicht mehr angezeigt.

Hinweis

Beim Verschieben in ein anderes Projekt wird der Chat mit dem Bot im Widget ausgeschaltet: Der Bot bleibt im bisherigen Projekt.

Baukasten

Im Baukasten sehen Sie das Widget so, wie es der Besucher sieht: Das Fenster ist geöffnet, darunter der runde Button. Daneben liegt ein Button mit Zahnrad: Er öffnet das Panel „Widget-Einstellungen“.

Bereich „Widget-Einstellungen“ neben dem WidgetBereich „Widget-Einstellungen“ neben dem Widget

Änderungen im Panel sind sofort am Widget sichtbar, auf die Website gelangen sie aber erst nach einem Klick auf „Speichern“. „Abbrechen“ stellt den zuletzt gespeicherten Zustand wieder her. Wenn Sie die Seite mit ungespeicherten Änderungen verlassen, fragt das Konto: „Änderungen sind nicht gespeichert. Seite verlassen?“.

Widget-Einstellungen

Einstellung Was sie festlegt
„Website-Domains“ Auf welchen Websites das Widget angezeigt werden darf
„Banner“ Bild über der Überschrift
„Link im Banner“ Adresse, die sich beim Klick auf das Banner öffnet. Das Feld erscheint, sobald ein Banner hochgeladen ist
„Überschrift“ Große Zeile oben im Fenster, bis zu 50 Zeichen. Pflichtfeld
„Beschreibung“ Text unter der Überschrift, bis zu 255 Zeichen
„Links“ Kontaktwege — die Zeilen im Widget-Fenster
„Chat mit dem Bot“ Chat direkt im Widget-Fenster — siehe Chat im Widget
„Design“ Hell, dunkel oder wie beim Besucher — siehe Design und Farben
„Farben“ Farben von Button, Akzent, Hintergrund und Text für jedes Design

Klicken Sie auf „Link hinzufügen“ und wählen Sie die Art:

Art Was Sie eingeben
„Link“ „Linkname“ — die Beschriftung im Widget — und die Adresse selbst. Jede Adresse ist möglich: eine Seite der Website, tel: mit einer Telefonnummer, mailto: mit einer E-Mail-Adresse
Telegram, MAX, VK, Viber Nur die Adresse. Name und Symbol werden automatisch eingesetzt

Für den Messenger, in dem Ihr Bot läuft, fügen Sie den allgemeinen oder einen zusätzlichen Link zum Bot aus dem Bereich „Links zum Chatbot“ ein — dann landen Übergänge aus dem Widget in der Statistik des Bots. Wo Sie ihn finden, steht im Bereich Links zum Chatbot. Sie können auch einen gewöhnlichen Link auf ein Profil oder eine Gruppe einfügen.

Das Zahnrad-Symbol bei einem Link öffnet das Fenster „Link-Einstellungen …“, das Kreuz löscht den Link. Die Reihenfolge ändern Sie durch Ziehen am Symbol links.

So verhalten sich die Links auf der Website:

  • Auf dem Smartphone öffnet ein Tippen den Link sofort.
  • Auf dem Computer öffnet ein Link auf einen Messenger oder ein soziales Netzwerk im Widget einen QR-Code mit dem Hinweis „Um an … zu schreiben, scannen Sie den QR-Code oder folgen Sie dem Link unten“ und einen Button zum Wechseln. Eine gewöhnliche „Link“ öffnet sich sofort in einem neuen Tab.
  • Ist die Adresse eines Messenger-Links nicht ausgefüllt, sieht der Besucher: „Kein Link hinterlegt. Dieser Kommunikationskanal ist vorübergehend nicht verfügbar“.

Klicken Sie auf „Foto auswählen“ und laden Sie ein Bild hoch — JPG, PNG oder GIF. Ein großes Bild wird an der längeren Seite auf 600 Pixel verkleinert. Das Papierkorb-Symbol auf dem Bild entfernt das Banner.

In „Link im Banner“ ist nur eine Webadresse möglich — sie beginnt mit http:// oder https://.

Wenn der Besucher den Chat öffnet, wird das Banner ausgeblendet, damit der Unterhaltung genug Platz bleibt.

Design und Farben

Wählen Sie unter „Design“, wie das Widget auf der Website aussieht:

  • „Hell“ — immer hell;
  • „Dunkel“ — immer dunkel;
  • „Wie beim Besucher“ — hell oder dunkel, wie das Design auf dem Gerät des Besuchers. Wechselt der Besucher das Design, färbt sich das Widget sofort um, ohne Neuladen der Seite.

Die Farben werden für jedes Design einzeln festgelegt. Bei „Wie beim Besucher“ steht über den Farben ein Umschalter „Hell | Dunkel“: Wählen Sie ein Design und stellen Sie seine Farben ein. Das Widget neben dem Panel zeigt das Design, das Sie gerade einrichten.

Die Einstellungen „Fußzeile“, „Design“ und „Farben“Die Einstellungen „Fußzeile“, „Design“ und „Farben“
Farbe Wo sie auf der Website erscheint
„Farbe der Schaltfläche“ Hintergrund des runden Widget-Buttons
„Symbolfarbe“ Symbol auf dem runden Button
„Akzent – Chatnachrichten und Schaltflächen“ Nachrichten des Besuchers und Buttons im Chat, Symbole von Chat und Links, Button unter dem QR-Code
„Fensterhintergrund“ Hintergrund des Widget-Fensters und des Chats
„Text“ Überschrift, Beschreibung, Links und Nachrichten

Die übrigen Farbtöne — Kopfbereich, Rahmen, Nebentext — leitet das Widget selbst aus Hintergrund und Text ab. Auch die Textfarbe auf dem Akzent wird automatisch gewählt: dunkel auf hellem Akzent, weiß auf dunklem. Messenger-Buttons unter dem QR-Code behalten ihre Markenfarben, und im dunklen Design steht der QR-Code auf einem weißen Hintergrund, damit eine Kamera ihn lesen kann.

„Standardfarben wiederherstellen“ setzt die Farben des gewählten Designs zurück.

Ein Widget mit dem Design „Wie beim Besucher“ auf einer WebsiteEin Widget mit dem Design „Wie beim Besucher“ auf einer Website

Hinweis

Widgets, die vor den Designs erstellt wurden, haben das Design „Hell“ mit ihren bisherigen Button-Farben. Das dunkle Design übernimmt davon die Button-Farbe und den Akzent; nach dem ersten Speichern werden die Farben der Designs getrennt gespeichert.

Website-Domains

Solange das Feld leer ist, funktioniert das Widget auf jeder Website, in die sein Code eingefügt ist. Damit keine fremde Website Ihr Widget zeigen kann, führen Sie Ihre Domains auf:

  • example.com — nur diese Domain (mit und ohne www.);
  • *.example.com — die Domain selbst und alle ihre Subdomains.

Sie können auch die vollständige Adresse einer Seite einfügen — übrig bleibt nur die Domain. Kyrillische Domains sind ebenfalls möglich. In der Liste sind bis zu 20 Domains erlaubt.

Widget-Symbol

Das Symbol erscheint im Konto — in der Liste der Widgets und im Umschalter — und auf der Website: im Kopf des Chats mit dem Bot, links neben dem Titel. Der Widget-Button selbst wird auf der Website in den Farben aus den Einstellungen gezeichnet.

Öffnen Sie „Symbol“ im Menü „⋯“ des Widgets oder „Symbol ändern“ im Widget-Umschalter und laden Sie ein Bild hoch: JPG, PNG, GIF, WebP oder AVIF bis 5 MB, am besten quadratisch. Das Symbol wird sofort gespeichert.

Fenster „Widget-Symbol“: hochgeladenes Symbol und Hinweis, wo es zu sehen istFenster „Widget-Symbol“: hochgeladenes Symbol und Hinweis, wo es zu sehen ist

Wenn etwas nicht funktioniert

  • Das Widget wird nicht gespeichert, Fehler beim Feld „Links“. Mindestens ein Link ist nötig. Ausnahme ist ein Widget mit eingeschaltetem Chat: Es braucht keine Links.
  • Fehler bei einem Link der Art „Link“. Bei ihm ist die Adresse Pflicht.
  • „Dieser Link kann nicht geöffnet werden: javascript:, data: und ähnliche Adressen sind nicht erlaubt.“ Fügen Sie eine gewöhnliche Adresse ein.
  • „Das Banner konnte nicht gespeichert werden: Die Datei ist nicht verfügbar.“ Ein hochgeladenes, aber nicht gespeichertes Bild wird nur kurz aufbewahrt. Laden Sie das Banner erneut hoch und klicken Sie sofort auf „Speichern“.
  • „Das Banner muss ein JPEG-, PNG-, GIF- oder WebP-Bild sein.“ Die Datei hat ein anderes Format. Speichern Sie das Bild in einem dieser Formate neu.
  • Fehler beim Feld „Website-Domains“. In einer Domain sind Buchstaben, Ziffern, Punkte und Bindestriche erlaubt; ein Sternchen nur am Anfang, in der Form *..
  • „Ein Projekt kann höchstens 100 Widgets enthalten“ — Hinweis am deaktivierten Button „Erstellen“.
  • „An einem Tag können maximal 100 Widgets erstellt werden.“ Warten Sie bis zum nächsten Tag.
  • „Das Erstellen und Bearbeiten von Widgets ist wegen eines Verstoßes gegen die Plattformregeln eingeschränkt.“ Siehe Prüfung der Widgets durch die Plattform.