So erstellen Sie AMP-Formulare in WordPress

Um das Laden von Websites auf Mobilgeräten zu beschleunigen, hat Google ein Projekt namens Accelerated Mobile Pages oder AMP entwickelt. Und obwohl es ein großartiges mobiles Surferlebnis bietet, indem es das Laden Ihrer Webseiten beschleunigt, deaktiviert es auch viele nützliche Funktionen auf Ihrer Website. Eine dieser Funktionen, die als großer Verlust angesehen werden kann, sind Kontaktformulare. Da AMP einen begrenzten Satz von HTML und JavaScript verwendet, kann es Ihre WordPress-Formulare nicht richtig auf AMP-Seiten laden. Glücklicherweise gibt es eine einfache Lösung. WPForms ist ein eher anfängerfreundliches WordPress-Formular-Plugin, mit dem Sie AMP-fähige WordPress-Formulare erstellen können. Im folgenden Artikel erklären wir Ihnen daher ausführlich, wie Sie mit WPForms AMP-Formulare in WordPress erstellen .

Erfahren Sie, wie Sie AMP-Formulare in WordPress erstellen

AMP ist also ziemlich nützlich, um Ihre Website mobilfreundlich zu gestalten. Und die Installation und Aktivierung des offiziellen AMP-Plugins für WordPress ist eine Voraussetzung für die Verwendung von AMP mit WordPress. Sobald Sie es aktiviert haben, fügt das Plugin automatisch Google AMP-Unterstützung für Ihre WordPress-Site hinzu . Sie können jedoch die AMP-Einstellungen für Ihre Website ändern, indem Sie in Ihrem Dashboard zu AMP > Allgemein gehen. Wenn Sie sich auf der Seite mit den AMP-Einstellungen befinden, können Sie AMP auf Ihrer Website aktivieren oder deaktivieren, aber auch einen Website-Modus für AMP und unterstützte Vorlagen auswählen. Nach der Konfiguration von AMP müssen Sie auf Ihrer WordPress-Seite ein AMP-kompatibles Kontaktformular erstellen.

Erstellen eines WordPress-Formulars mit WPForms

Um den Prozess einzuleiten, müssen Sie das WPForms Lite-Plugin auf Ihrer Website installieren und aktivieren. Dies ist die Lite-Version des WPForms Pro-Plugins. Sowohl die Pro- als auch die Lite-Version von WPForms ermöglichen es Ihnen, ein einfaches AMP-fähiges Kontaktformular zu erstellen. Hier werden wir über die kostenlose Version sprechen. Nachdem Sie das Plugin installiert und aktiviert haben, müssen Sie zu WPForms > Neue Seite hinzufügen gehen, um ein neues WordPress-Formular zu erstellen. Auf dem Formulareinrichtungsbildschirm können Sie eine Formularvorlage auswählen, um schnell loszulegen.

Wenn Sie bei Null anfangen möchten, empfehlen wir Ihnen, sich für das Blanko-Formular zu entscheiden. Es öffnet dann die Formularerstellungsseite. Von hier aus können Sie Formularfelder hinzufügen oder entfernen. Um Ihrem Formular ein neues Feld hinzuzufügen, klicken Sie einfach im linken Bereich auf ein Formularfeld, und es wird rechts im Formularerstellungsbereich angezeigt. Nachdem Sie fertig sind, können Sie die Feldoptionen konfigurieren. Klicken Sie dazu auf ein Feld und es erscheinen Feldoptionen. Auf ähnliche Weise können Sie alle anderen Felder anpassen.

Klicken Sie danach auf die Registerkarte Einstellungen, um Ihre Formulareinstellungen zu konfigurieren. Über die allgemeinen Einstellungen können Sie Ihren Formularnamen ändern, Schaltflächentext senden, Schaltflächenverarbeitungstext senden, Anti-Spam-Honeypot aktivieren und vieles mehr. Gehen Sie zur Registerkarte Benachrichtigungen, um E-Mail-Benachrichtigungen einzurichten, die Sie darüber informieren, wenn ein Benutzer das Formular ausfüllt. Auf der Registerkarte „Bestätigungen“ können Sie eine Bestätigungsnachricht einrichten, die angezeigt wird, wenn ein Benutzer das Formular absendet. Nachdem die Konfiguration abgeschlossen ist, stellen Sie sicher, dass Sie Ihr Formular speichern.

Hinzufügen eines AMP-Formulars zu einer Seite

Wenn Ihr WordPress-Formular fertig ist, können Sie es einer Seite hinzufügen. Sie müssen zunächst eine neue Seite erstellen oder eine vorhandene Seite öffnen, auf der Sie das Formular hinzufügen möchten. Öffnen Sie Ihren Seitenbearbeitungsbildschirm, klicken Sie auf das Symbol Neuen Block hinzufügen und fahren Sie mit der Auswahl des WPForms-Blocks fort. Danach können Sie das WPForms-Widget sehen, das Ihrem Seitenbearbeitungsbildschirm hinzugefügt wurde. Sie müssen nur das zuvor erstellte Formular auswählen, und das Widget lädt es sofort in den Seiteneditor. Sie können Ihre Seite auch veröffentlichen oder aktualisieren. Und das ist alles. Sie müssen nichts weiter konfigurieren. Das Plugin WPForms Lite fügt Ihrem Formular jetzt volle AMP-Unterstützung hinzu. Falls Sie daran interessiert sind, wie es aussieht, können Sie die Seite auf Ihrem Mobiltelefon öffnen.

So fügen Sie Ihrem AMP-Formular Google reCAPTCHA hinzu

WPForms enthält standardmäßig einen Anti-Spam-Honeypot zum Abfangen und Blockieren von Spam. Darüber hinaus können Sie Google reCAPTCHA verwenden, um Spam-Übermittlungen zu reduzieren. Um Google reCAPTCHA mit Ihren AMP-Formularen zu verwenden, müssen Sie Ihre Website für Google reCAPTCHA v3 registrieren und die Google-API-Schlüssel erhalten. Rufen Sie dazu die Google reCAPTCHA-Website auf und klicken Sie oben rechts auf der Seite auf die Schaltfläche „Admin-Konsole“. Anschließend müssen Sie sich mit Ihrem Google-Konto anmelden. Daraufhin sehen Sie die Seite „Neue Website registrieren“. Beginnen Sie mit dem Ausfüllen, indem Sie den Namen Ihrer Website in das Feld Label eingeben. Google AMP unterstützt nur reCAPTCHA v3, daher müssen Sie es aus den reCAPTCHA-Typoptionen auswählen.

Wenn Sie fertig sind, geben Sie Ihren Domainnamen im Bereich Domains ein. Der Abschnitt Eigentümer zeigt standardmäßig Ihre E-Mail-Adresse an. Beachten Sie, dass Sie auch eine weitere E-Mail-Adresse hinzufügen können, wenn Sie dies wünschen. Als Nächstes müssen Sie die reCAPTCHA-Nutzungsbedingungen akzeptieren, um fortzufahren. Vergessen Sie auch nicht, das Kontrollkästchen „Änderungen an Eigentümer senden“ zu aktivieren. Dadurch kann Google Sie über Probleme wie Fehlkonfigurationen und verdächtigen Datenverkehr auf Ihrer Website informieren. Wenn Sie fertig sind, klicken Sie auf die Schaltfläche Senden. Sie sehen dann eine Erfolgsmeldung zusammen mit dem Websiteschlüssel und dem geheimen Schlüssel, um reCAPTCHA auf Ihrer Website hinzuzufügen. Mit diesem Schlüssel können Sie Ihren Formularen reCAPTCHA hinzufügen.

Zusätzliche Anpassungen

Es gibt jedoch noch eine weitere Anpassung, um die Sie sich kümmern müssen. Dadurch wird die AMP-Kompatibilität mit dem reCAPTCHA sichergestellt. Um darauf zuzugreifen, klicken Sie dort auf den Link „Gehe zu den Einstellungen“. Dadurch gelangen Sie erneut zu den reCAPTCHA-Einstellungen mit dem Kontrollkästchen „Diese Taste darf mit AMP-Seiten arbeiten“. Aktivieren Sie einfach das Kontrollkästchen und klicken Sie unten auf die Schaltfläche Speichern.

Nachdem Sie nun Google-API-Schlüssel zum Hinzufügen von reCAPTCHA zu AMP-Formularen haben, gehen Sie in Ihrem WordPress-Dashboard zur Seite WPForms > Einstellungen > reCAPTCHA. Wählen Sie dann die Option reCAPTCHA v3 und fügen Sie den Site-Schlüssel und den geheimen Schlüssel ein. Klicken Sie auf die Schaltfläche Einstellungen speichern. Jetzt, da Google reCAPTCHA zu WPForms hinzugefügt wurde, können Sie es bei Bedarf in Ihren Formularen aktivieren. Gehen Sie zu WPForms > Alle Formulare und wählen Sie das Formular aus, in dem reCAPTCHA aktiviert werden soll. Wenn der Bildschirm zum Einrichten des Formulars angezeigt wird, klicken Sie auf die Registerkarte Einstellungen und wählen Sie den Abschnitt Allgemeine Einstellungen aus. Sie sehen das Kontrollkästchen „Google v3 reCAPTCHA aktivieren“. Aktivieren Sie dieses Kontrollkästchen und speichern Sie Ihr Formular. Besuchen Sie danach erneut Ihre Kontaktseite und sehen Sie sich das AMP-Formular mit reCAPTCHA in Aktion an.

Nicht so viel dazu

Wie Sie sehen können, müssen Sie sich nicht viel Mühe geben, um AMP-Formulare in WordPress zu erstellen. Vor allem, wenn Sie diesen Ratgeber an Ihrer Seite haben. Wir hoffen, dass wir Ihnen weitergeholfen haben und dass Sie alle Vorteile von AMP-Formularen sehen, nachdem Sie diese wenigen einfachen Schritte befolgt haben.