Mit Friendly Captcha schützt du deine Aivie Formulare vor automatisierten Spam-Einträgen. Dafür erstellst du ein Friendly Captcha Konto, hinterlegst die Zugangsdaten in Aivie und ergänzt das Captcha in den gewünschten Formularen.
Was brauche ich für die Einrichtung?
Du benötigst ein Konto bei Friendly Captcha und das Friendly Captcha Plugin in deiner Aivie Installation. Falls das Plugin unter Einstellungen > Plugins fehlt, kontaktiere das Aivie Team, damit wir es für dich bereitstellen können.
1. Konto erstellen und E-Mail-Adresse bestätigen
Registriere dich unter friendlycaptcha.com/signup/. Öffne die Bestätigungs-E-Mail und klicke auf Confirm email address.
Im Dashboard erstellst du eine Application und einen API Key. Bei dieser Anmeldung wirst du nicht nach der Version gefragt. Die Version v2 stellst du später im Aivie Plugin ein.
2. Anwendung für Aivie anlegen
- Öffne Applications > New application.
- Gib als Namen beispielsweise Aivie ein und klicke auf Next.
Unter Use-cases beschreibst du deinen geplanten Einsatz.
Wähle für diese Aivie Einrichtung ausschliesslich die passenden Optionen unter Forms: Contact, Support, Newsletter Signup, Survey, Job Application, Event Registration und Lead Capture. Du kannst alle auswählen, wenn du diese Formulare nutzt oder planst. Lass Data Access und die übrigen Bereiche abgewählt.
Mit den Use-cases teilst du Friendly Captcha mit, wofür du den Dienst einsetzen möchtest. Die Auswahl allein aktiviert keinen zusätzlichen Schutz. Insbesondere blockiert die Option Web Scraping weder Google noch AI Crawler automatisch und ist für den Schutz deiner Aivie Formulare nicht nötig.
Der Schutz entsteht erst, wenn du das Captcha wie unten beschrieben in dein Formular einfügst und Aivie die Prüfung beim Absenden durchführt. Öffentliche Seiteninhalte bleiben dadurch für Suchmaschinen und AI Crawler zugänglich.
- Klicke auf Next, prüfe Summary und schliesse die Erstellung ab.
- Kopiere den Site Key deiner Anwendung für die spätere Eingabe in Aivie.
3. API Key erstellen
- Öffne Keys > New API Key.
- Gib als Key name beispielsweise Aivie ein.
- Wähle unter Expires das Ablaufdatum gemäss euren Vorgaben. Bei No expiry bleibt der Schlüssel bis zur Löschung gültig.
- Klicke auf Next.
Unter Permissions benötigt der Schlüssel die Berechtigung zur Prüfung von Captcha-Antworten. Diese Berechtigungen sind von den Use Cases deiner Anwendung getrennt.
Kopiere den erstellten API Key sofort und speichere ihn sicher, beispielsweise im Passwortmanager. Er wird nur einmal angezeigt. Aktiviere I’ve saved this key in a safe place und klicke auf Confirm & Close.
4. Friendly Captcha in Aivie aktivieren
- Öffne in Aivie Einstellungen > Plugins und wähle Friendly Captcha.
- Bleibe im Reiter Enabled/Auth.
- Stelle den Schalter von No auf Yes.
- Füge den Site Key aus Friendly Captcha in das Feld Site Key ein.
- Füge deinen API Key in das Feld Api Key ein.
5. Im Reiter «Features» die einfache Einbindung wählen
Wechsle jetzt zum Reiter Features, den du im folgenden Screenshot siehst. Für die Einrichtung ohne zusätzliche Programmierung verwendest du diese Einstellungen:
- Wähle bei Friendly Captcha version den Eintrag Friendly Captcha v2. Die Version muss zu deinen Zugangsdaten passen.
- Wähle bei Embedding type die erste Option: Legacy embedding: Mautic embeds all scripts automatically. Necessary for iframes.
- Lass die Einstellung Load delay when embedding the captcha für den ersten Test auf dem voreingestellten Wert.
- Klicke auf Save & Close.
Mit Legacy embedding lädt Aivie die benötigten Skripte selbst. Du musst deshalb keinen zusätzlichen Friendly Captcha Code auf deiner Website einbauen. Diese Option ist auch für Formulare erforderlich, die du per iFrame einbindest.
Warum steht bei «Automatic embedding» trotzdem «RECOMMENDED»? Diese Variante ermöglicht es deinem Website-Team, die Friendly Captcha Skripte unabhängig vom Aivie Plugin aktuell zu halten. Dafür muss es die Skripte zusätzlich auf deiner Website einbauen. Für die einfache Einrichtung durch dich als Marketinganwender ist deshalb Legacy embedding die passende Wahl. «Manual embedding» benötigst du für diese Anleitung nicht.
6. Friendly Captcha zum Formular hinzufügen
- Öffne unter Komponenten > Formulare das gewünschte Formular zur Bearbeitung.
- Füge ein neues Feld vom Typ Friendly Captcha hinzu.
- Deaktiviere beim Captcha-Feld Save Result. Weitere Einstellungen am Captcha-Feld musst du nicht ändern. Platziere es vor dem Absenden-Button und speichere das Formular.
- Wiederhole dies für jedes Formular, das du schützen möchtest. Das Aktivieren des Plugins allein schützt bestehende Formulare noch nicht.
Wenn du den Formularcode manuell in deine Website kopiert hast, übernimm nach der Änderung auch den aktualisierten Code. Hinweise zur Einbindung findest du in der FAQ Wie baue ich ein Newsletter-Formular in meine Website ein?.
7. Formular auf deiner Website testen
Öffne die Seite mit deinem Formular in einem privaten Browserfenster. Prüfe, ob Friendly Captcha angezeigt wird, fülle das Formular aus und sende eine Testanfrage. Kontrolliere anschliessend in Aivie, ob die Einsendung angekommen ist.
Wird das Captcha nicht angezeigt oder lässt sich das Formular nicht absenden, kontrolliere zuerst den Site Key, den API Key und die ausgewählte Version. Prüfe auch die für deine Anwendung erlaubten Domains bei Friendly Captcha. Bei einer Einbindung per iFrame kann die Aivie Domain relevant sein.
So sieht das fertige Formular aus
Friendly Captcha erscheint vor dem Absenden-Button. Ob Besucher auf «Ich bin ein Mensch» klicken müssen, hängt vom Widget Mode ab.
Die FAQ Kann Friendly Captcha im Hintergrund laufen, ohne dass Besucher klicken müssen? erklärt die Modi Smart, One-click und Zero-click.
Zusammenfassung
Erstelle dein Friendly Captcha Konto, trage Site Key und API Key in Aivie ein und wähle unter «Features» die Version v2 sowie «Legacy embedding». Ergänze danach das Friendly Captcha Feld in jedem gewünschten Formular und teste die Einsendung auf deiner Website.
