Klicken Sie oben im Bedienfeld auf die Schaltfläche "Einstellungen", um auf die allgemeinen Einstellungen der Seite zuzugreifen.

Daraufhin öffnet sich ein Menü mit den folgenden Abschnitten: Allgemein, Messenger, Analytik, Farben, Schriftarten und HTML.

Allgemein

Seiteninformationen

Name in der Liste

Sie können hier einen beliebigen Text eingeben. Dieser Name ist nur für Sie in der Seitenliste sichtbar.

URL

In diesem Feld können Sie einen benutzerdefinierten Link (URL) für die Seite festlegen. Wenn Sie es leer lassen, wird automatisch ein eindeutiger Name aus Buchstaben und Zahlen generiert.

Anforderungen:

Es dürfen nur die folgenden Zeichen verwendet werden:

  • Lateinische Buchstaben (a–z)
  • Ziffern (0–9)
  • Unterstrich (_)

Der Name muss innerhalb der Plattform eindeutig sein. Wenn er bereits von einem anderen Benutzer vergeben wurde, können Sie ihn nicht erneut verwenden.

Sie können Ihre eigene Domain mit der Website verbinden.
Wenn Sie den Namen im Link nicht ändern können, ist der Name bereits vergeben.
Sie können zusätzliche Zeichen hinzufügen oder einen anderen Namen wählen.

Name des Browser-Tabs

Standardmäßig entspricht der Name des Browser-Tabs dem Feld Site-Name, Sie können ihn jedoch anpassen, um ihn prägnanter oder beschreibender zu gestalten.

Der Name des Browser-Tabs wird in der Adressleiste der Seite angezeigt.

Tag

Ein Tag ist eine Bezeichnung, die an Ihren Bot gesendet wird, sobald ein Benutzer auf das Messenger-Symbol klickt. Damit können Sie sofort bestimmte Bot-Abläufe starten, ohne auf die erste Nachricht des Benutzers warten zu müssen.

Geben Sie den Tag-Namen im Feld "Trigger" eines Trigger-Blocks ein.

Der Tag wird in den Seiteneinstellungen zugewiesen.

Der im Feld Tag angegebene Wert wird in der Variable tag des Clients gespeichert. Diese Variable kann später für Analysezwecke verwendet werden.

Eine Nachricht, die diesen Tag enthält, löst eine bestimmte Aktion im Trichter Ihres Bots aus, z. B. das Senden einer Antwort oder den Übergang zum nächsten Schritt.

Geben Sie einen Tag ein, z. B.: welcome_offer

Der gespeicherte Tag wird im Seiteninformationsbereich angezeigt.

So verwenden Sie einen Messenger-Tag

Weisen Sie zunächst in Ihren Site-Einstellungen einen Tag wie main_flow zu. Geben Sie dann diesen genauen Tag in den Trigger-Block Ihres Chatbots ein.

Festlegen eines Chat-Einstiegspunkts

Legen Sie einen bestimmten Block (z. B. den Start Ihres Haupttrichters) als Einstiegspunkt für Ihre Bot-Logik fest. Wenn ein Benutzer auf Ihrer Website auf das Messenger-Symbol klickt, gelangt er in den Messenger und beginnt sofort an diesem vordefinierten Punkt.

Informationen zum Konfigurieren von Formularblöcken und Messenger-Weiterleitungsschaltflächen finden Sie in der Anleitung "Formularantworten" unter Inhaltseinstellungen.

Wenn ein Benutzer auf die Schaltfläche klickt, wird er aufgefordert, direkt zum Messenger zu gehen.

  • Der Benutzer wechselt von der Website zum Messenger.
  • Der Benutzer tippt auf die Schaltfläche "Start" oder "Starten" (je nach Gerät). Selbst wenn der Benutzer bereits mit dem Bot interagiert hat, muss er diese Schaltfläche drücken, um den Bot von der Website aus zu starten – dies ist eine Anforderung der Messenger-Plattform für Bots.
  • Anstelle von /start erhält der Bot den in den Website-Einstellungen angegebenen Tag.
  • Der Client erhält die erste Nachricht aus dem Trichter, der durch den angegebenen Tag ausgelöst wird.
  • Das Profil des Clients enthält die folgende Variable:

Um die Analytik für einen Tag anzuzeigen, gehen Sie zum Abschnitt "Analytik" und öffnen Sie die Registerkarte "Clients".

Erstellen Sie als Nächstes ein neues Widget, in dem Sie die wichtigsten Einstellungen festlegen:

  • Analysezeitraum: z. B. "Letzter Monat", "Gesamte Zeit" usw.;
  • Widget-Name: ein beliebiger Name;
  • Geben Sie einen Tag an, der verfolgt werden soll.

Fügen Sie dann ein Widget hinzu.

Fertig! Sie können jetzt verfolgen, wie oft Ihr Bot von Ihrer Website aus mit einem Tag gestartet wird.

Die integrierte Analytik von MaviBot ermöglicht es Ihnen, Chats, Operator-Effizienz, Kursfortschritt und Client-Metriken kostenlos zu verfolgen, sodass keine externen Tools erforderlich sind.

Weitere Informationen finden Sie im Artikel "MaviBot-Analytik".

Bildeinstellungen

Vorschaubild

Dies ist das Miniaturbild oder Titelbild, das verwendet wird, wenn Ihre Website geteilt wird (z. B. in sozialen Medien oder Messaging-Apps). Standardmäßig wird das erste Bild Ihrer Seite verwendet. Um eine benutzerdefinierte Vorschau festzulegen, laden Sie Ihr ausgewähltes Bild in dieses Feld hoch.

Site-Schutzeinstellungen / reCAPTCHA

Um reCAPTCHA einzurichten, müssen Sie ein Paar Schlüssel (öffentlicher und geheimer Schlüssel) in den allgemeinen Einstellungen Ihrer Website angeben und die reCAPTCHA-Überprüfung in Ihren Formulareinstellungen aktivieren.

Sie können einen beliebigen CAPTCHA-Dienst zum Schutz Ihrer Website wählen. In diesem Abschnitt sehen wir uns an, wie Sie Google reCAPTCHA installieren.

  1. Schlüssel erhalten

Um zu beginnen, müssen Sie die grundlegenden Informationen zum Erhalten der Schlüssel ausfüllen: Wählen Sie die CAPTCHA-Typen aus und fügen Sie die Domain der Website hinzu, auf der der Schutz installiert werden soll. Klicken Sie dann auf "Senden".

  1. Schlüsseleingabe

Als Nächstes sehen Sie ein Paar Schlüssel, die Sie kopieren und in die Seiteneinstellungen Ihrer Website in MaviBot einfügen müssen.

  1. CAPTCHA im Abschnitt "Formular" aktivieren

Wie Sie den Abschnitt "Formular" erstellen und damit arbeiten, wird im Artikel hier erklärt.

Sobald der Abschnitt Formular eingerichtet ist, öffnen Sie seine Einstellungen.

Klicken Sie auf "Einstellungen", um das Seitenmenü zu öffnen.

Dort ist ein Kontrollkästchen zum Aktivieren von CAPTCHA sichtbar.

Authentifizierung

Diese Option hilft, Benutzer herauszufiltern, die versuchen, ohne Autorisierung auf die Site zuzugreifen. Es ist jedoch besser, sie zu aktivieren, nachdem alles andere eingerichtet ist und Sie sicher sind, dass die Konfiguration korrekt ist. Sobald sie aktiviert ist, ist der einzige Weg, auf die Site zuzugreifen, die Autorisierungsschaltfläche, die vom Bot gesendet wird.

Beginnen wir damit, die Domain mit dem Telegram-Bot zu verknüpfen, der mit Ihrem Projekt verbunden ist.

Schritt 1: Gehen Sie zu BotFather, wo Sie Ihren Telegram-Bot erstellt haben.

Schritt 2: Wählen Sie einen Telegram-Bot aus, den Sie mit der Website verbinden möchten, und klicken Sie darauf.

Schritt 3: Gehen Sie zu den Einstellungen des Telegram-Bots.

Schritt 4: Navigieren Sie in den Bot-Einstellungen zu Domain.

Schritt 5: Klicken Sie auf "Domain festlegen".

Wenn Sie bereits eine Domain mit dem Bot verknüpft haben oder eine neue Domain für denselben Bot festlegen müssen, wird die Schaltfläche "Domain festlegen" durch "Domain zurücksetzen" ersetzt.

Schritt 6: Senden Sie eine Domain, die Sie mit dem Telegram-Bot verknüpfen möchten: Geben Sie dazu die Domain in das Nachrichteneingabefeld ein und senden Sie sie an den Bot.

Dies kann entweder Ihre persönliche Domain sein, die Sie von einem Domainnamen-Registrar erhalten haben, oder etwas wie mavitbot.ai

An diesem Punkt ist die Domainbindung abgeschlossen.

Nachdem Sie die Domain mit dem Bot verknüpft haben, aktivieren Sie das Kontrollkästchen "Autorisierung über Telegram erforderlich" in den Formulareinstellungen:

Schnittstellen- und Zugriffseinstellungen

Zugriff nur über Listen

Diese Option ermöglicht es Ihnen, den Zugriff auf die Site basierend auf der Anwesenheit des Benutzers in bestimmten Listen Ihres Projekts zu gewähren.

So blenden Sie den Hinweis "Erstellt mit MaviBot" aus

Um den Hinweis auszublenden, aktivieren Sie einfach dieses Kontrollkästchen, falls erforderlich.

Sie können den Hinweis "Erstellt mit MaviBot" in jedem kostenpflichtigen Tarif entfernen. Wir schätzen jeden, der den Hinweis "Erstellt mit MaviBot" auf seinen Seiten behält.

HTML/CSS/JS

Sie können diesen Abschnitt bei Bedarf ausfüllen.
Wenn Sie mit CSS vertraut sind, können Sie Ihre Website noch ansprechender gestalten. Sie können hier auch Analysecode, einen Facebook-Pixel und mehr einfügen.

BITTE BEACHTEN SIE!
Wenn Sie Skriptbeispiele kopieren, stellen Sie sicher, dass ein geöffneter Tag auch geschlossen werden muss.
Zum Beispiel: <script> ... </script>, <style> ... </style>

So ändern Sie den Link zur Datenschutzerklärung

Im Bewerbungsformularblock mit Messenger-Schaltflächen können Sie ein Kontrollkästchen für die Datenschutzerklärung anzeigen.
Standardmäßig verlinkt es auf die Datenschutzerklärung des Konstruktors.

Sie können den Link mithilfe eines Skripts auf Ihre eigene Datenschutzerklärungsseite ändern.

Fügen Sie das Skript im Abschnitt CSS und JS in das Feld "HTML-Code (body)" ein.

<script>
document.getElementsByClassName('mavibot-privacy__link')[0].href = "Link zur Datenschutzerklärung";
</script>

So deaktivieren Sie die Seitenindizierung

Um die Seitenindizierung zu deaktivieren, fügen Sie das Skript in das Feld HTML-Code (head) ein.

<meta name="robots" content="noindex, nofollow">

So entfernen Sie die Facebook-Schaltfläche von Ihrer Site-Seite

Fügen Sie das Skript im Abschnitt CSS und JS in das Feld "HTML-Code (body)" ein.

<script>
document.getElementsByClassName('vk_link')[0].remove()
</script>

So entfernen Sie den Titel Ihrer Site-Seite

Fügen Sie das Skript im Abschnitt CSS und JS in das Feld "HTML-Code (body)" ein.
Dies gilt für ältere Versionen von Mini-Landingpages.

<script>
document.getElementsByClassName('title_container')[0].remove()
</script>

So bearbeiten Sie den Link der Telegram-Schaltfläche.

Fügen Sie das Skript im Abschnitt CSS und JS in das Feld "HTML-Code (body)" ein.

<script>
window.onload = function() {
    let button = document.querySelector('.tg_link')
    if (button) {
        button.setAttribute('data-url', 'der erforderliche Wert')
        button.removeAttribute('onclick')
        let newUrl = button.getAttribute('data-url')
        button.addEventListener('click', () => {
            window.location.href = newUrl
        })
    }
}
</script>

Ersetzen Sie für andere Messenger tg_link durch insta_link, fb_link usw.

So aktualisieren Sie einen Schaltflächentext

Fügen Sie diesen Code im Abschnitt CSS und JS in das Feld "HTML-Code (body)" ein.

  1. Um die Messenger-Schaltfläche anzuzeigen, erstellen Sie einen Bewerbungsformularblock mit Fragen und geben Sie an, für welche Messenger die Schaltflächen angezeigt werden sollen

Stellen Sie den Schaltflächenanzeige-Stil auf "Symbol mit Text" ein

Weitere Details zum Abschnitt Formular finden Sie hier. Link

  1. Fügen Sie im Abschnitt Site-Einstellungen unter der Registerkarte CSS und JS den folgenden Code in das Feld "HTML-Einstellungen" → "HTML-Code (body)" ein:

Dieser Code ändert den Schaltflächentext für Telegram und Viber. Fügen Sie für andere Messenger ähnlichen Code gemäß dem Beispiel hinzu.

So richten Sie Schaltflächen in einer Reihe aus

Fügen Sie das folgende Skript in das Feld "JS-Code" in den Haupteinstellungen Ihrer Mini-Landingpage ein.

$(function() {
$('.link_group').css("flexWrap", 'noWrap')
})

So ändern Sie ein Favicon

Fügen Sie das Skript im Abschnitt CSS und JS in das Feld "HTML-Code (head)" ein.

Dieser Code kann verwendet werden, um das Favicon zu ändern – das Symbol einer Website oder Webseite.

So übergeben Sie alle URL-Variablen/-Parameter beim Öffnen Ihrer Website

Sie müssen das Skript auf ALLEN Seiten IHRER Website platzieren, die einen Proxy-Link enthalten. Das Skript muss direkt nach dem <body>-Tag hinzugefügt werden.

Wenn Sie Ihre eigene Domain für Proxy-Links verwenden, sollten Sie sbsite.pro durch Ihre Domain ersetzen.

Wenn Ihre Website Proxy-Links zu Messengern von der Site-Seite enthält, können Sie dieses Skript hinzufügen – es übergibt alle Variablen, die zum Öffnen der Site verwendet wurden, an den Bot.

<script>
var links = document.getElementsByTagName("a")
for (let i of links) {
    if (i.href.startsWith("https://mavibot.site/")) {
        if (i.href.split("?").length > 1) {
            i.href += "&" + location.search.split("?")[1]
        } else {
            i.href += location.search
        }
    }
}</script>

So leiten Sie Analytik-Cookies an den Bot weiter

Das Skript muss auf ALLEN Seiten IHRER Website platziert werden, die einen Proxy-Link enthalten. Es sollte direkt nach dem <body>-Tag hinzugefügt werden.

Wenn Sie Ihre eigene Domain für Proxy-Links verwenden, müssen Sie mavibot.ai durch Ihre Domain ersetzen.

Wenn Sie Analytik-Cookies an den Bot übergeben müssen, fügen Sie das folgende Skript zu Ihrer Site hinzu:

<script>
setTimeout(function() {
    var links = document.getElementsByTagName("a");
    var cookies = ['_fbc', '_fbp', '_ga', '_ym_uid', 'roistat_visit'];
    var cookies_string = '';

    cookies.forEach(function(cookie_name){
        let cookie_val = get_cookie(cookie_name);
        if (cookie_val !== undefined) {
            cookies_string += (cookies_string != '' ? "&" : '') + cookie_name + "='" + cookie_val + "'";
        }
    });

    for (let i of links) {
        if (i.href.startsWith("https://salebot.site/")) {
            if (i.href.split("?").length > 1) {
                i.href += "&" + cookies_string;
            } else {
                i.href += "?" + cookies_string;
            }
        }
    }

    function get_cookie(name) {
        let matches = document.cookie.match(new RegExp("(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"));
        return matches ? decodeURIComponent(matches[1]) : undefined;
    }
}, 3000);
</script>

So ändern Sie den Link zur Datenschutzerklärung

Fügen Sie auf der Registerkarte CSS und JS den folgenden Code in das Feld "HTML-Einstellungen" → "HTML-Code (body)" ein:

Dieses Skript ermöglicht es Ihnen, den Link zur Datenschutzerklärung durch Ihren eigenen zu ersetzen.

<script>
document.getElementsByClassName('mavibot-privacy__link')[0].href = "Richtlinien-Link";
</script>

Messenger

Erste WhatsApp-Nachricht

Der hier eingegebene Text wird automatisch als Entwurf in WhatsApp angezeigt, wenn der Benutzer auf den Link von Ihrer Website klickt.

Sie können einfach im Messenger auf "Senden" drücken.

  1. Erstellen Sie im Builder einen "Start"-Block.
  2. Geben Sie den Text Ihrer ersten Nachricht darin ein.

Analytik

Aktivieren Sie die Einstellung "Analytikdaten für Konversion speichern", um die Konversionsverfolgung Ihrer Site zu erhalten.

Dadurch können Sie Konversionen auf der Registerkarte Analytik überwachen.

Website-Export / Seitenimport

Der Website-Builder ermöglicht es Ihnen, ganze Seiten zu exportieren und zu importieren. Dies ist nützlich, um eine Site zwischen Projekten zu übertragen, ohne sie neu erstellen zu müssen, wobei der gesamte Inhalt erhalten bleibt.

So exportieren/importieren Sie eine Seite:

  1. Stellen Sie zunächst sicher, dass alle Ihre Änderungen gespeichert sind, indem Sie auf die Schaltfläche "Speichern" klicken.

Klicken Sie im Editor auf "Seite exportieren", um Ihre Seite zu exportieren.

Sobald die Datei heruntergeladen wurde (Sie sehen sie in Ihrem Download-Ordner und erhalten eine Bestätigung), gehen Sie zu den Site-Einstellungen in Ihrem Zielprojekt. Klicken Sie dort auf "Erstellen", um eine identische Seite zu erstellen.

Wählen Sie die exportierte Seitendatei aus, die Sie zuvor gespeichert haben. Sobald der Upload mit einer Benachrichtigung bestätigt wird, gelangen Sie direkt zum Editor, um mit der Arbeit an der importierten Seite zu beginnen.

Nehmen Sie bei Bedarf die erforderlichen Anpassungen vor und klicken Sie auf die Schaltfläche "Speichern".

Wo finde ich die Seiten-ID?

Die Site-Seiten-ID aus der Site-Liste kann an Bot-Funktionen übergeben werden – zum Beispiel, um einen Link zu Ihrer Site über den Bot zu senden oder sie als Mini-App in Telegram zu öffnen.

Weitere Informationen zu Telegram WebApp finden Sie in diesem Artikel.

Die Site-Nummer wird automatisch mit dem Symbol # zugewiesen.

Sie finden die Seiten-ID, indem Sie mit der Maus über die gewünschte Site-Seite fahren.