Der flexibelste Formularersteller für Elementor – MetForm ist der schnellste Weg, benutzerfreundliche Kontaktformulare mit der höchsten Anzahl an Funktionen zu erstellen. Mit den hochwertigen vorgefertigten Webdesign-Layouts, die im Drag-and-Drop-Kontaktformular-Builder enthalten sind, können Sie optisch ansprechende Formulare erstellen.

MetForm-Plugin integrates with Google reCAPTCHA giving you the option to keep your website safe from spam and abuses. Read this documentation to learn how to add reCAPTCHA to WordPress using MetForm.

How to Add reCAPTCHA Spam Protection for WordPress Form #

To create a contact form in WordPress with reCAPTCHA, you will need to have the following plugins:

Erforderliche Plugins:

1. Elementor: Plugin herunterladen
2. MetForm: Plugin herunterladen

Watch the video guide on how to create contact form for WordPress with captcha:

Step 1: Generate reCAPTCHA (v2) Site Key and Secret Key from Google #

Gehen Sie zunächst zu Google reCAPTCHA-Seite um einen neuen reCAPTCHA Site Key und Secret Key für Ihre Site zu erstellen. Auf der Seite:

1.1 Typ a Etikett für die Seite.

1.2 Wählen Sie die reCAPTCHA-Typ. Hier haben wir uns für reCAPTCHA v2 entschieden.

1.3 Fügen Sie die hinzu Domain Ihrer Website.

1.4 Geben Sie Ihre (Eigentümer) ein E-Mail-Adresse.

1.5 Akzeptieren Sie die reCAPTCHA-Nutzungsbedingungen.

1.6 Klicken Sie Einreichen Taste.

1.7 Auf der nächsten Seite erhalten Sie die Site-Schlüssel Und Geheimer Schlüssel für reCAPTCHA. Kopieren Sie sie zur späteren Verwendung.

Step 2: Enable reCAPTCHA for WordPress #

So fügen Sie reCAPTCHA zu Metform hinzu:

1. Navigieren Sie zu Metform > Settings > General aus Ihrem WordPress-Dashboard.
2. Unter dem reCAPTCHA Settings, select the Google reCaptcha version: V2 or V.
3. Geben Sie die ein Site-Schlüssel that your have generated earlier.
4. Then, enter ther Geheimer Schlüssel that your have generated along with.
5. Scroll down in the page and click the Änderungen speichern Taste.

Step-3: Add reCAPTCHA to WordPress Form in Elementor #

So fügen Sie reCAPTCHA zu einem Formular hinzu:

3.1 Erstellen Sie ein neues Formular oder öffnen Sie ein Formular mit dem Elementor-Editor.

3.2 Finden Sie die reCAPTCHA-Widget aus dem Editor-Panel. Ziehen Sie es dann in das Design.

Notiz- Zwei der MetForm-Demos sind mit reCaptcha-Feldern gestaltet. Dies sind das einfache Kontaktformular 1 und das einfache Kontaktformular 2. Für eine leere Demo oder eine andere Demo müssen Sie das reCaptcha-Widget per Drag-and-Drop verschieben und dann damit arbeiten.

3.3 Fügen Sie einen zusätzlichen Klassennamen hinzu, wo Sie dem Wrapper des Recaptcha eine neue Klasse hinzufügen können, dann können Sie der Klasse benutzerdefiniertes CSS/JS hinzufügen. 

3.4 Klicken Sie auf Aktualisieren Klicken Sie auf die Schaltfläche, um den Vorgang abzuschließen. 

3.5 Sehen Sie sich abschließend die Vorschau von reCAPTCHA an Vorschauseite.

[Hinweis: Die reCAPTCHA-Vorschau ist im Editor nicht verfügbar. reCAPTCHA wird auf der Vorschauseite angezeigt.]

Anwenden von reCAPTCHA (v3) #

Um reCAPTCHA v3 anzuwenden, müssen Sie mit Schritt 1 beginnen. Beginnen Sie mit der Generierung der beiden Schlüssel für v3. Gehen Sie als Nächstes zu Schritt 2, wählen Sie v3 aus und kopieren Sie die Schlüssel und fügen Sie sie ein.
Schauen Sie sich jetzt die Formularvorschau an –

Wenn Sie die oben genannten Schritte ausführen, können Sie reCAPTCHA mithilfe des MetForm reCAPTCHA WordPress-Plugins problemlos in Elementor integrieren.