Sie fragen sich, wie Sie die Schaltfläche "Senden" aus Berechnungsformularen entfernen können, um die Benutzerfreundlichkeit zu erhöhen?
Durch das Entfernen der Schaltfläche "Senden" von Berechnungsformularen, die von WPForms erstellt wurden, können Sie Ihren Besuchern sofortige Berechnungen anbieten.
In diesem Leitfaden erfahren Sie, wie Sie Ihre Formulare in einfachen Schritten für nahtlose Echtzeitberechnungen ändern können, ohne dass eine Formularübermittlungsaktion erforderlich ist.
Entfernen der Schaltfläche "Senden" aus Berechnungsformularen
Entfernen Sie die Schaltfläche "Senden" aus Berechnungen Formen mit WPForms ist unglaublich einfach. Alles, was Sie tun müssen, ist diese einfachen Schritte unten folgen:
In diesem Artikel
Die Voraussetzungen
Bevor wir mit den Schritten zur Deaktivierung der Übermittlungsschaltfläche fortfahren, sollten wir sicherstellen, dass wir einige wichtige Schritte durchgeführt haben.
Wenn Sie diese Schritte bereits ausgeführt haben, können Sie mit dem Abschnitt über das Entfernen der Schaltfläche "Senden" fortfahren.
1. Mit einer WPForms Pro Lizenz
WPForms ist ein seriöses Plugin für Formularerstellung und -berechnung, mit dem Benutzer eine breite Palette von Formularen erstellen können, darunter auch einen Rechner für die Tage zwischen den Daten.
Es ist wichtig, dass Sie die neueste Version von WPForms installiert haben, zusammen mit dem Zugriff auf die Pro-Lizenz.
Die Pro-Version bietet Ihnen Zugang zu Premium-Integrationen, Addons und vielen wertvollen Funktionen wie bedingter Logik, Formularübermittlungsberichten usw.
2. Verwendung des Addons Berechnungen
Um benutzerdefinierte Rechner in WordPress zu erstellen, wissen Sie wahrscheinlich schon, dass Sie das WPForms Calculations Addon installiert haben müssen.
Mit diesem Addon können Sie logische Operatoren und Wenn-Dann-Anweisungen einfügen, um personalisierte Angebote zu erstellen oder intelligente Rechner zu bauen.
Sie können sogar integrierte mathematische Funktionen nutzen, um Zahlen zu runden, Zeitspannen zu berechnen, Durchschnittswerte zu ermitteln und vieles mehr.
3. Auswählen einer Rechnerformularvorlage
Schließlich müssen Sie ein Formular bereithalten. Wenn Sie eines erstellen müssen, bietet WPForms mehr als 2.000 vorgefertigte Vorlagen, die die Formularerstellung zu einem Kinderspiel machen.
Dazu gehören professionell gestaltete Rechnerformularvorlagen, die an eine Vielzahl von Anwendungsfällen und Branchen angepasst werden können, z. B:
- Hypothekenrechner-Formularvorlage - perfekt für Immobilienagenturen, da es potenziellen Käufern ermöglicht, Hypotheken und ihre monatlichen Zahlungen mühelos zu berechnen.
- Shipping Cost Calculator Form Template - hilft eCommerce-Websites sparen Zeit und Mühe durch die Bereitstellung einer einfachen Versandrechner für Kunden.
- BMI-Rechner-Formularvorlage - ideal für Websites, die sich mit körperlicher Fitness oder Gesundheit befassen und den Nutzern bei der Bewertung ihres aktuellen Gesundheitszustands helfen.
- ROI Calculator Form Template - unterstützt Unternehmen und Vermarkter bei der effizienten Bewertung der Rentabilität ihrer Kampagnen oder Projekte.
Und das Beste daran: Sie können mit dem Berechnungs-Addon ganz ohne HTML-, Javascript- oder komplexe Programmierkenntnisse eigene Rechner erstellen.
Entfernen der Schaltfläche "Senden
Sobald diese Voraussetzungen erfüllt sind, können Sie Ihr Formular so ändern, dass die Schaltfläche "Senden" entfernt wird, um die Benutzerfreundlichkeit zu erhöhen.
1. Gehen Sie zu der WPForms Snippet-Bibliothek
Gehen Sie in Ihrem WordPress-Dashboard einfach zu WPForms " Tools. Navigieren Sie dann zur Registerkarte " Code Snippets ".
Dies wird eine Pop-up-Meldung, die sagt, "Bitte installieren Sie WPCode, um die WPForms Snippet-Bibliothek zu verwenden".
2. Installieren + Aktivieren von WPCode
Jetzt müssen Sie nur noch auf die Schaltfläche Installieren + Aktivieren von WPCode klicken. Die Installation des Plugins dauert nun ein paar Sekunden.
Sobald das WPCode-Plugin installiert ist, können Sie auf die vollständige Liste der WPForms-Snippets zugreifen.
3. Verwenden Sie das Snippet "Submit-Button ausblenden
Suchen Sie nun nach dem Snippet für die Schaltfläche "Senden ausblenden", indem Sie seinen Namen in das Feld " Snippets suchen" eingeben. Klicken Sie anschließend auf die Schaltfläche Snippet installieren .
Hier ist der Codeausschnitt, den wir importieren werden:
Dadurch werden Sie auf die Vorschauseite des WPCode-Snippets weitergeleitet, wo Sie den automatisch integrierten Code sehen können.
Jetzt müssen Sie nur noch den Snippet-Code aktivieren. Schieben Sie dazu den Schalter von Inaktiv auf Aktiv.
Der nächste Schritt zur Aktivierung des Code-Snippets für die gesamte Website besteht darin, auf die Schaltfläche Aktualisieren zu klicken, die sich direkt neben der Option Aktiv befindet.
Wenn Sie diesen Ansatz verfolgen, müssen Sie das Snippet nur einmal über die WPForms Snippet-Bibliothek hinzufügen.
Dann muss der Benutzer für jedes Formular, in dem er dieses Snippet verwenden möchte, den Namen der CSS-Klasse "Submit Button" innerhalb des Builders hinzufügen.
4. CSS-Klasse für die Schaltfläche "Senden" hinzufügen
Jetzt müssen Sie nur noch die CSS-Klasse in den Formularersteller des Rechners einfügen, aus dem Sie die Schaltfläche "Senden" entfernen möchten.
Öffnen Sie dazu Ihr Taschenrechnerformular, gehen Sie auf die Registerkarte Allgemein und dann auf die Registerkarte Erweitert.
Danach fügen Sie die wpf-calc-form CSS in die CSS-Klasse für die Schaltfläche "Senden um den Codeschnipsel zu aktivieren.
Sie können nun eine Vorschau Ihres Formulars anzeigen, um zu sehen, dass die Schaltfläche "Absenden" aus Ihrem Taschenrechner erfolgreich entfernt wurde!
Weitere Fragen zu Rechnerformulare
Rechnerformulare sind ein beliebtes Thema bei unseren Lesern. Hier finden Sie Antworten auf einige häufig gestellte Fragen zu diesen Formularen.
Um die Schaltfläche "Submit" in einem Formular zu deaktivieren, insbesondere wenn Sie WPForms Pro verwenden, können Sie benutzerdefinierte CSS anwenden. Gehen Sie zu WPForms " Tools. Navigieren Sie dann zur Registerkarte Code Snippets und greifen Sie auf die WPForms Snippet-Bibliothek zu, die eine Lösung enthält, um die Schaltfläche "Submit" in einem Formular zu deaktivieren.
Ja, ein Formular kann auch ohne eine Schaltfläche "Senden" funktionieren. Dies ist häufig bei Formularen der Fall, die automatisch absenden oder alternative Methoden zur Datenerfassung verwenden. Mit WPForms Pro können Sie solche Formulare erstellen, indem Sie sie mit CSS anpassen, um die Schaltfläche "Senden" auszublenden, und die WPCode-Integration verwenden, um den erforderlichen Code nahtlos hinzuzufügen.
Als nächstes erfahren Sie, wie Sie einen benutzerdefinierten Online-Rechner erstellen können.
Das Hinzufügen eines Rechners zu Ihrer Website kann das Engagement steigern, indem es die Besucher zum Verweilen und zur Beantwortung ihrer Probleme anregt. In dieser Anleitung erfahren Sie , wie Sie einen benutzerdefinierten Rechner in WordPress für die speziellen Anforderungen Ihrer Website erstellen.
Erstellen eines benutzerdefinierten Online-Rechners
Sind Sie bereit, Ihr Formular zu erstellen? Starten Sie noch heute mit dem einfachsten WordPress-Formularerstellungs-Plugin. WPForms Pro enthält viele kostenlose Vorlagen und bietet eine 14-tägige Geld-zurück-Garantie.
Wenn dieser Artikel Ihnen geholfen hat, folgen Sie uns bitte auf Facebook und Twitter für weitere kostenlose WordPress-Tutorials und -Anleitungen.
Dieses CSS verhindert nicht, dass das Formular abgeschickt wird, wenn die Eingabetaste in einem der Textfelder innerhalb eines Rechnerformulars verwendet wird.
Hallo Dean,
Sie haben Recht - dieses CSS-Snippet blendet nur die Schaltfläche "Submit" aus, verhindert aber nicht, dass das Formular abgeschickt wird, wenn die Eingabetaste in einem Textfeld gedrückt wird.
Wenn Sie die Eingabetaste ebenfalls deaktivieren möchten, empfehlen wir Ihnen, das Code-Snippet zu verwenden, das Sie in unserer Entwicklerdokumentation hier finden: So verhindern Sie, dass die Eingabetaste das Formular abschickt.
Ich hoffe, das hilft!