So erstellen Sie einen benutzerdefinierten Rechner in WordPress (Schritt für Schritt)

Interaktive Inhalte sind eine der besten Möglichkeiten, das Engagement zu steigern und Besucher länger auf Ihrer Website zu halten. Ein benutzerdefinierter Rechner kann die Fragen Ihrer Nutzer sofort beantworten und Ihnen gleichzeitig helfen, mehr Leads zu generieren.

Wir haben Dutzende von Formular-Builder-Plugins getestet, um die anfängerfreundlichste Lösung für die Erstellung von Rechnern zu finden. Nach unserer Erfahrung ermöglicht Ihnen das richtige Tool, alles von BMI-Schätzern bis hin zu Versandkostenrechnern zu erstellen, ohne Code schreiben zu müssen.

In diesem Artikel zeigen wir Ihnen Schritt für Schritt, wie Sie ganz einfach einen benutzerdefinierten Rechner in WordPress erstellen können.

Warum einen benutzerdefinierten Rechner in WordPress hinzufügen?

Ein benutzerdefinierter Rechner ermöglicht es Benutzern, Dinge schnell zu berechnen, ohne Ihre Website zu verlassen.

Zum Beispiel, wenn Sie einen Gesundheits- und Fitness-Blog haben, könnten Sie einen BMI-Rechner hinzufügen, damit Benutzer ihren BMI sehen und entscheiden können, welchen Abonnementplan oder welches Produkt sie von Ihrer Website kaufen möchten.

Wenn Sie weltweit verkaufen, kann ein Online-Rechner, der metrische Einheiten in imperiale Einheiten umrechnet, Ihnen auch mehr Verkäufe bringen, indem er Kunden hilft zu prüfen, ob ein Produkt die gewünschte Größe oder das gewünschte Gewicht hat.

Sie können auch Vertrauen aufbauen und Warenkorbabbrüche reduzieren, indem Sie einen Versandrechner anbieten. Auf diese Weise werden Kunden beim Auschecken nicht von unerwarteten Kosten überrascht.

Oder Sie können einen Hypothekenrechner zu Ihrer Immobilien-Website hinzufügen oder einen Autokreditrechner zu Ihrer Fahrzeug-Händler-Website.

Diese benutzerdefinierten Rechner sind auch eine großartige Möglichkeit, Leads zu generieren. Sie können die Benutzer beispielsweise auffordern, ihre E-Mail-Adresse einzugeben, damit Sie ihnen ihre Ergebnisse zusenden können. Auf diese Weise kann ein Rechner Ihnen helfen, eine E-Mail-Liste in WordPress aufzubauen.

Nichtsdestotrotz wollen wir uns ansehen, wie man einfach einen benutzerdefinierten Rechner in WordPress erstellt.

So erstellen Sie einen benutzerdefinierten Rechner in WordPress

Sie können ganz einfach einen benutzerdefinierten Rechner in WordPress mit WPForms erstellen. Es ist das beste Plugin für benutzerdefinierte Rechner und Formular-Builder auf dem Markt. Es verfügt über einen Drag-and-Drop-Builder, über 2000 vorgefertigte Vorlagen und vollständigen Spam-Schutz.

Tatsächlich lieben wir WPForms so sehr, dass wir es für alle Kontaktformulare auf unserer Website sowie für unsere jährliche Umfrage verwenden.

Das Plugin verfügt außerdem über ein Calculations-Addon, mit dem Sie ganz einfach jeden gewünschten Rechner erstellen können, einschließlich eines Hypothekenrechners, eines Versandrabatts, eines Altersrechners und mehr. Weitere Informationen finden Sie in unserem WPForms-Testbericht.

Zuerst müssen Sie das WPForms-Plugin installieren und aktivieren. Detaillierte Anweisungen finden Sie in unserem Anfängerleitfaden, wie Sie ein WordPress-Plugin installieren.

Besuchen Sie nach der Aktivierung die Seite WPForms » Einstellungen im Admin-Menü von WordPress, um Ihren Lizenzschlüssel einzugeben.

Sie können diesen Schlüssel in Ihrem Konto auf der WPForms-Website erhalten.

Gehen Sie danach zur Seite WPForms » Addons im WordPress-Dashboard und suchen Sie nach dem 'Calculations Addon'.

Sobald Sie das getan haben, klicken Sie einfach auf die Schaltfläche „Addon installieren“, um es auf Ihrer Website zu aktivieren.

Gehen Sie als Nächstes von Ihrem Admin-Dashboard zur Seite WPForms » Neu hinzufügen.

Dies führt Sie zur Seite „Vorlage auswählen“, auf der Sie mit der Eingabe eines Namens für das Formular, das Sie erstellen möchten, beginnen können.

Danach können Sie in der linken Spalte auf die Option „Rechner“ klicken, um die über 87 vorgefertigten Rechnervorlagen von WPForms zu öffnen, darunter:

• Hypothekenrechner-Vorlage
• Trinkgeldrechner-Vorlage
• Leasingrechner-Vorlage
• BMI-Rechner-Vorlage
• Spar- & Anlage-Rechner-Vorlage

Von hier aus können Sie unter jeder gewünschten Formularvorlage auf die Schaltfläche „Vorlage verwenden“ klicken. Für dieses Tutorial erstellen wir ein einfaches Formular „Versandrabatt-Rechner“.

Dies öffnet den Formular-Builder auf Ihrem Bildschirm. Hier sehen Sie eine Formularvorschau auf der rechten Seite mit Formularfeldern in der linken Spalte.

Sie können nun ganz einfach weitere Felder aus dem linken Bereich hinzufügen und sie auch per Drag & Drop neu anordnen.

Scrollen Sie dann zum Abschnitt „Verfügbare Elemente“ und klicken Sie auf dieses Feld, um dessen Einstellungen in der Seitenleiste zu öffnen.

Sobald Sie das getan haben, können Sie den Titel, das Bild und die Preise für alle Artikel hinzufügen, die Sie in Ihrem E-Commerce-Shop verkaufen.

Beachten Sie jedoch, dass Sie die Option „Bildoptionen verwenden“ aktivieren müssen, wenn Sie Bilder für die von Ihnen verkauften Artikel hinzufügen möchten.

Sie können auch auf die Schaltfläche „+“ klicken, um weitere Elemente hinzuzufügen, oder auf die Schaltfläche „-“, um ein Element aus dem Abschnitt zu entfernen.

Klicken Sie als Nächstes auf das Feld mit der Bezeichnung „Versandkosten“, um dessen Einstellungen in der linken Spalte zu öffnen. Dieses Feld berechnet den Versandrabatt basierend auf Ihrem Gesamtproduktpreis. Dieses Feld enthält die Formel, die für die Berechnung benötigt wird, daher ist es wichtig, es nicht zu löschen.

Standardmäßig enthält diese Vorlage eine vordefinierte Formel, die einen Versandrabatt basierend auf dem Gesamtbestellpreis berechnet.

Wenn Sie jedoch den Versandrabatt ändern möchten, wechseln Sie zur Registerkarte „Erweitert“ in der linken Spalte und scrollen Sie zum Abschnitt „Formel“.

Hier können Sie den Wert von 10 durch den Rabattprozentsatz ersetzen, den Sie anbieten möchten. Sie können auch die Produktgesamtsummen ändern.

Wenn Sie den Versandrabatt weiter anpassen möchten, können Sie oben auf den Link „Spickzettel“ klicken. Dies führt Sie zur Seite „Formel-Spickzettel für Berechnungen“, auf der Sie die zu verwendenden Regeln und Zeichenfolgen besser verstehen können.

Danach können Sie die Einstellungen für alle anderen Feldoptionen auf die gleiche Weise konfigurieren.

Neu: Möchten Sie eine einfachere Möglichkeit, Ihre Berechnungsformeln zu erstellen? WPForms bietet jetzt eine leistungsstarke Funktion für KI-Berechnungen, die die mühsame Arbeit für Sie erledigt.

Klicken Sie einfach auf die Schaltfläche „Formel generieren“ neben dem Formelfeld, um mit dem KI-Assistenten zu chatten.

Dann können Sie einfach in einfacher Sprache beschreiben, was Sie berechnen möchten.

Sie könnten zum Beispiel eingeben: „Wenden Sie einen Versandrabatt von 15 % auf Bestellungen über 100 US-Dollar an und erhöhen Sie dann den Rabatt um 0,25 % für jeweils weitere 50 US-Dollar Umsatz.“

Nach dem Drücken der „Enter“-Taste generiert die KI automatisch die richtige Formel, die Sie mit einem Klick zu Ihrem Formular hinzufügen können.

Wenn Sie fertig sind, vergessen Sie nicht, oben auf die Schaltfläche 'Speichern' zu klicken, um Ihre Einstellungen zu speichern.

Öffnen Sie nun die WordPress-Seite oder den Beitrag, auf dem Sie das Versandkostenrechner-Formular hinzufügen möchten, im Block-Editor.

Klicken Sie von hier aus auf die Schaltfläche „Block hinzufügen“ (+) in der oberen linken Ecke, um das Blockmenü zu öffnen und den WPForms-Block einzubetten.

Sobald Sie dies getan haben, wählen Sie einfach das Versandrabatt-Rechnerformular aus dem Dropdown-Menü im Block selbst aus.

Klicken Sie abschließend auf die Schaltfläche „Aktualisieren“ oder „Veröffentlichen“ oben, um Ihre Einstellungen zu speichern. Nun können Sie Ihre WordPress-Website besuchen, um das benutzerdefinierte Rechnerformular in Aktion zu sehen.

Hier berechnet das Versandfeld automatisch die Versandkosten gemäß der Preisgestaltung der verschiedenen Artikel, die Ihr Kunde von Ihrer Website bestellt.

Anpassen Ihres Rechnerformulars in WordPress

Möglicherweise versuchen Sie irgendwann, den Rechner zu ändern, um zu sehen, ob Sie mehr Conversions erzielen können. Sie möchten beispielsweise das Feld „E-Mail“ als Pflichtfeld festlegen.

Um diese Änderungen vorzunehmen, besuchen Sie einfach die Seite WPForms » Alle Formulare im WordPress-Dashboard.

Sobald Sie dort sind, klicken Sie auf den Link „Bearbeiten“ unter dem Formularnamen, um es erneut im Formular-Builder zu öffnen.

Sie können nun die Formularfelder anpassen oder neue Felder hinzufügen, indem Sie den oben beschriebenen Prozess befolgen.

Wenn Sie fertig sind, klicken Sie einfach auf die Schaltfläche „Speichern“, und diese Änderungen werden automatisch auf Ihrer Geschäftswebsite oder Ihrem Blog angezeigt.

Anzeigen Ihrer Rechnerformular-Einträge

Immer wenn jemand ein Formular auf Ihrer Website ausfüllt, speichert WPForms dessen Eintrag automatisch in Ihrer WordPress-Datenbank. Dies ermöglicht es Ihnen zu sehen, wie die Leute das Formular verwenden, und die Kontaktinformationen Ihrer Besucher einzusehen.

Um diese Informationen anzuzeigen, gehen Sie einfach zur Seite WPForms » Einträge im WordPress-Dashboard und scrollen Sie zum Abschnitt „Formularname“.

Klicken Sie danach auf das Rechnerformular, um die Einträge anzuzeigen.

Dies öffnet eine Liste aller Formulareinträge auf Ihrer Seite. Von hier aus können Sie auf das Kreissymbol klicken, um einen Eintrag als gelesen zu markieren.

Sie können auch auf den Link „Anzeigen“ neben jedem Eintrag klicken, um alle Formulardetails anzuzeigen, einschließlich E-Mail-Adresse, Telefonnummer, bestellte Artikel, Versandrabatt und mehr.

Manchmal möchten Sie die Daten eines Formulars mit Personen teilen, die keinen Zugriff auf Ihr WordPress-Dashboard haben. Zum Beispiel könnten Sie eine WordPress-Entwicklungsagentur betreiben und mehrere Websites für Kunden verwalten.

Mit WPForms können Sie Ihre Daten als CSV- oder XLSX-Datei exportieren. Klicken Sie einfach auf den Link 'Alle exportieren' oben, um das Export-Tool zu öffnen.

Dies öffnet einen neuen Bildschirm, auf dem Sie alle Formularfelder auswählen können, deren Daten Sie exportieren möchten. Klicken Sie anschließend auf die Schaltfläche „Exportdatei herunterladen“, um Ihre Formulardaten als XLSX-Datei zu speichern.

Bonus: Erstellen Sie komplexe benutzerdefinierte Rechner mit Formidable Forms

Wenn Sie komplexere Rechner auf Ihrer WordPress-Website erstellen möchten, empfehlen wir die Verwendung von Formidable Forms. Es ist ein fortschrittliches Formular-Plugin mit einem Drag-and-Drop-Builder, vorgefertigten Vorlagen und dynamischen Feldern.

Darüber hinaus kann das Plugin erweiterte Berechnungen mit Formeln, bedingter Logik und sogar datumsbasierten Berechnungen durchführen, was es zu einer großartigen Wahl für komplexe Projekte macht.

Sie können das Plugin verwenden, um verschiedene Arten von Rechnern zu erstellen, wie z. B. einen Prozentrechner, einen Preisrechner, einen Darlehensrechner, einen Altersrechner, einen Lebensversicherungsrechner und einen Zinseszinsrechner.

Zum Beispiel, wenn Sie Kurse online verkaufen, könnten Sie ein ROI-Rechner-Formular hinzufügen, um Benutzern zu zeigen, wie der Kauf Ihres Kurses ihr Verdienstpotenzial steigern kann.

Zu den weiteren Funktionen von Formidable Forms gehören bedingte Logik, Fortschrittsanzeigen, mehrseitige Formulare und ein ChatGPT-Feld, das den Benutzern hilft, das Formular schneller auszufüllen.

Formidable Forms kann sogar mit verschiedenen E-Mail-Marketingdiensten integriert werden, um Ihre E-Mail-Liste zu erweitern. Weitere Informationen finden Sie in unserem vollständigen Formidable Forms-Testbericht.

Häufig gestellte Fragen zu WordPress-Rechnern

Hier sind einige der häufigsten Fragen, die unsere Leser uns zum Hinzufügen benutzerdefinierter Rechner zu ihren Websites stellen.

1. Kann ich einen benutzerdefinierten Rechner in WordPress ohne Plugin erstellen?

Ja, aber es erfordert fortgeschrittene technische Kenntnisse. Sie müssten benutzerdefinierten JavaScript- und PHP-Code schreiben, um die Mathematik und Logik zu verarbeiten. Für die meisten Benutzer ist die Verwendung eines Plugins wie WPForms viel sicherer, schneller und einfacher.

2. Muss ich komplexe mathematische Formeln kennen?

Nein. Obwohl Sie Ihre eigenen Formeln schreiben können, enthält WPForms jetzt eine KI-Integration. Sie können einfach in einfacher Sprache beschreiben, was der Rechner tun soll, und das Plugin schreibt die Formel für Sie.

3. Kann ich Zahlungen basierend auf den Rechnerergebnissen akzeptieren?

Absolut. Wenn Sie einen Angebots- oder Versandkostenrechner erstellen, können Sie Zahlungs-Gateways wie Stripe oder PayPal integrieren. Dies ermöglicht es Ihnen, den genauen Betrag, der im Berechnungsfeld angezeigt wird, sofort einzuziehen.

4. Kann ich die in den Rechner eingegebenen Daten speichern?

Ja. Plugins wie WPForms speichern jede Formularübermittlung in Ihrer WordPress-Datenbank. Sie können diese Einträge anzeigen, in eine Tabelle exportieren oder sie mit Ihrem E-Mail-Marketing-Service verbinden, um Leads zu verfolgen.

Zusätzliche Ressourcen

Wir hoffen, dieser Artikel hat Ihnen geholfen, einen benutzerdefinierten Rechner in WordPress hinzuzufügen. Möglicherweise möchten Sie auch einige zusätzliche Ressourcen sehen:

• So generieren Sie mit kostenlosen Online-Rechnern mehr Leads (Profi-Tipps)
• Die besten Rechner-Plugins für Ihre WordPress-Site
• So fügen Sie einen BMI-Rechner in WordPress hinzu
• So fügen Sie Ihrer WordPress-Website einen Versandkostenrechner hinzu
• So fügen Sie einen Hypothekenrechner in WordPress hinzu
• So erstellen Sie einen Autokredit-/Autozahlungsrechner

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.