Technologische Neuigkeiten, Bewertungen und Tipps!

So erstellen Sie ein Online-Bestellformular in WordPress (Schritt f√ľr Schritt)

Einige unserer Leser haben gefragt, wie ein Online-Bestellformular erstellt werden soll, damit Kunden ihre Bestellungen problemlos auf der Website aufgeben können.

Wenn Sie ein Unternehmen wie ein Restaurant oder ein physisches Geschäft haben, möchten Sie möglicherweise keinen vollständigen Online-Shop erstellen. Möglicherweise möchten Sie Ihren Kunden jedoch eine einfache Möglichkeit bieten, Lebensmittel oder andere Produkte zur Lieferung zu bestellen.

In diesem Beitrag zeigen wir Ihnen, wie Sie ein Online-Bestellformular in WordPress erstellen. Auf diese Weise k√∂nnen Sie problemlos Kundenbestellungen abholen, ohne Ihrer Website eine vollst√§ndige E-Commerce-Software hinzuf√ľgen zu m√ľssen.

Erstellen Sie ein Online-Bestellformular in WordPress

Vielleicht haben Sie k√ľrzlich beschlossen, eine Website f√ľr Ihr Unternehmen zu starten, und f√ľhlen sich etwas √ľberfordert.

Viele Unternehmen eröffnen einen Online-Shop, um nicht nur Bestellungen abzuholen, sondern auch Zahlungen anzunehmen und Lagerbestände zu verwalten. Allerdings benötigen nicht alle Unternehmen eine vollständige E-Commerce-Website.

Wenn Sie nur m√∂chten, dass Kunden ein Bestellformular online ausf√ľllen k√∂nnen, k√∂nnen Sie es ganz einfach ohne Warenkorbl√∂sung erstellen.

Ein einfaches Online-Bestellformular bietet Ihnen die M√∂glichkeit, Zahlungen online, zum Zeitpunkt der R√ľcknahme der Bestellung oder bei Lieferung zu akzeptieren.

In diesem Tutorial verwenden wir WPForms, um ein Online-Bestellformular zu erstellen, da Sie es einfach √ľber die Drag & Drop-Oberfl√§che ausf√ľhren k√∂nnen.

WPForms ist das beste WordPress Form Builder Plugin auf dem Markt. Mehr als 3 Millionen Websites verwenden WPForms, um auf einfache Weise jede Art von Online-Formular zu erstellen und zu ihrer Website hinzuzuf√ľgen (keine Programmierkenntnisse erforderlich).

Zun√§chst m√ľssen Sie das WPForms-Plugin installieren und aktivieren. Ben√∂tigen Sie Hilfe bei der Installation des Plugins? Ausf√ľhrliche Anweisungen finden Sie in unserer Anleitung zur Installation eines WordPress-Plugins.

Plugins sind wie Apps f√ľr Ihre WordPress-Website. Wenn Sie WordPress noch nicht kennen, lesen Sie unseren Artikel dar√ľber, was WordPress-Plugins sind und was Sie damit tun k√∂nnen.

Sobald Sie das WPForms-Plugin aktiviert haben, wird in der Admin-Seitenleiste Ihres WordPress-Dashboards eine neue Registerkarte WPForms angezeigt.

Sie m√ľssen besuchen WPForms ¬ĽKonfiguration Seite, um Ihren Lizenzschl√ľssel einzugeben. Sie finden diese Informationen in Ihrem Konto auf der WPForms-Website.

Jetzt können Sie Ihr Online-Bestellformular erstellen.

Geh einfach zu WPForms ¬ĽNeu hinzuf√ľgen Seite, um Ihr erstes Formular zu erstellen.

Sie sehen nun den Formularerstellungsbildschirm. Geben Sie einen Namen f√ľr Ihr Formular ein und w√§hlen Sie eine Vorlage. Wir empfehlen die Vorlage Abrechnungs- / Bestellformular.

Wählen Sie zum Starten die Vorlage "Abrechnungs- / Bestellformular"

Bewegen Sie den Mauszeiger √ľber die Vorlagenbeschreibung und klicken Sie auf die Schaltfl√§che Rechnungs- / Bestellformular erstellen.

Klicken Sie auf die Schaltfläche "Rechnungs- / Bestellformular erstellen", um Ihr Formular zu erstellen

Ihr Formular wird automatisch f√ľr Sie erstellt und Sie werden direkt zum WPForms-Formulareditor weitergeleitet.

Ihr neu erstelltes Online-Bestellformular

Jetzt k√∂nnen Sie Ihr Online-Bestellformular nach Belieben bearbeiten. Die verschiedenen Teile des Formulars werden als Felder bezeichnet. Sie k√∂nnen Felder in Ihrem Formular mit einem einzigen Klick √§ndern, hinzuf√ľgen oder l√∂schen.

Die Standardvorlage enth√§lt bereits Felder f√ľr die meisten Informationen, die Sie wahrscheinlich ben√∂tigen, z. B. Name, Adresse und Telefonnummer. Sie m√ľssen jedoch Ihre tats√§chlichen Produkte auflisten.

Klicken Sie auf das Feld Verf√ľgbare Elemente, um es zu bearbeiten.

Bearbeiten des Felds "Verf√ľgbare Artikel" Ihres Online-Bestellformulars

Schreiben Sie den Namen und den Preis jedes Artikels auf, den Kunden bei Ihnen bestellen k√∂nnen. Der Preis wird nicht automatisch auf dem Formular angezeigt. Sie k√∂nnen ihn daher dem Artikelnamen hinzuf√ľgen.

Bearbeiten des Felds 'Verf√ľgbare Elemente', um die Namen der Elemente zu √§ndern

Um weitere Optionen hinzuzuf√ľgen, klicken Sie einfach auf das Symbol (+), zu dem Sie die zus√§tzlichen Elemente hinzuf√ľgen m√∂chten.

F√ľgen Sie Ihrem Online-Bestellformular weitere Artikel hinzu

Hinweis: Sie k√∂nnen beliebig viele Elemente hinzuf√ľgen. Kunden k√∂nnen jedoch nur eine Option aus diesem Feld ausw√§hlen.

Wenn Sie mehrere Kategorien von Optionen haben, können Sie das Feld kopieren, um Gruppen zu erstellen.

Sie k√∂nnen das Feld Verf√ľgbare Elemente kopieren, indem Sie auf das Symbol Kopieren klicken, das angezeigt wird, wenn Sie den Mauszeiger dar√ľber halten oder wenn es ausgew√§hlt ist.

Kopieren Sie das Feld "Verf√ľgbare Artikel", um ein neues Feld in Ihrem Bestellformular zu erstellen

Stellen Sie sicher, dass Sie auch die Bezeichnung der Felder so √§ndern, dass sie f√ľr jede Gruppe geeignet ist.

Wenn Sie m√∂chten, dass Kunden zwei oder mehr Optionen in einem einzelnen Feld ausw√§hlen k√∂nnen, m√ľssen Sie einen anderen Feldtyp verwenden.

Klicken Sie auf die Registerkarte Felder hinzuf√ľgen und scrollen Sie nach unten zu Zahlungsfelder, wo Sie das Feld Kontrollk√§stchen finden. Ziehen Sie diese per Drag & Drop in Ihr Formular.

F√ľgen Sie ein Kontrollk√§stchen hinzu, damit Kunden mehrere Artikel gleichzeitig ausw√§hlen k√∂nnen

Sie k√∂nnen dieses Feld jetzt wie zuvor bearbeiten und Namen und Preise f√ľr Ihre Artikel eingeben. Kunden k√∂nnen so viele Artikel pr√ľfen, wie sie bestellen m√∂chten.

Wenn Sie Bilder Ihrer Produkte anzeigen möchten, ist dies ebenfalls sehr einfach. Klicken Sie einfach auf das Feld Bildoptionen verwenden:

F√ľgen Sie Ihrem Online-Bestellformular Bilder Ihrer Produkte hinzu

Klicken Sie f√ľr jedes Element auf die Schaltfl√§che Bild hochladen, um Bilder von Ihrem Computer oder Ihrer WordPress-Medienbibliothek hinzuzuf√ľgen.

Laden Sie ein Bild eines von Ihnen angebotenen Produkts hoch

WPForms √§ndert die Gr√∂√üe oder Komprimierung Ihrer Bilder nicht. Daher ist es wichtig, sie auf die richtige Gr√∂√üe hochzuladen. Sie m√ľssen alle dieselbe Gr√∂√üe und nicht mehr als 250 √ó 250 Pixel haben.

Idealerweise sollten Sie Ihre Bilder auch f√ľr das Web optimieren.

Schlie√ülich m√∂chten Sie m√∂glicherweise das Feld Kommentar oder Nachricht am unteren Rand des Formulars bearbeiten, damit es nicht erforderlich ist. Nicht alle Benutzer m√∂chten eine Nachricht hinzuf√ľgen.

Klicken Sie einfach auf das Feld und deaktivieren Sie das Kontrollkästchen Erforderlich rechts, um dieses Feld optional zu machen.

Machen Sie das Feld 'Kommentar / Nachricht' optional anstatt obligatorisch

Sie k√∂nnen diesen Vorgang f√ľr jedes Feld ausf√ľhren, das optional sein soll. Sie k√∂nnen erkennen, welche Felder erforderlich sind, da sie neben der Feldbezeichnung ein rotes Sternchen haben.

Sobald Sie mit dem Design Ihres Formulars zufrieden sind, können Sie mit der Einrichtung fortfahren. Es ist eine gute Idee, das Formular zuerst zu speichern, indem Sie oben auf dem Bildschirm auf die Schaltfläche Speichern klicken:

Die Schaltfläche "Speichern" von WPForms wird in der oberen rechten Ecke des Bildschirms angezeigt

Festlegen der Benachrichtigungen, die Ihr Bestellformular senden wird

Klicken Sie zunächst auf die Registerkarte Einstellungen auf der linken Seite des Bildschirms. Dadurch werden Ihre Formulareinstellungen geöffnet.

Die Registerkarte "Einstellungen" in WPForms

Klicken Sie dann auf die Registerkarte Benachrichtigungen, um die E-Mail-Benachrichtigungen f√ľr Ihr Formular zu √§ndern. Standardm√§√üig werden ausgef√ľllte Bestellformulare per E-Mail an die Administrationsadresse Ihrer WordPress-Site gesendet.

Möglicherweise möchten Sie dies ändern oder die Bestellformulare an mehrere Adressen kopieren. Sie können einfach die E-Mail-Adresse oder Adressen in das Feld An E-Mail-Adresse senden eingeben. Wenn Sie mehr als eine E-Mail-Adresse eingeben, trennen Sie diese durch ein Komma.

Geben Sie die durch Kommas getrennten E-Mail-Adressen ein, an die das Formular gesendet werden soll

M√∂glicherweise m√∂chten Sie auch die Betreffzeile √§ndern, damit sie nicht f√ľr jede Bestellung gleich ist. Dies k√∂nnte es einfacher machen, Bestellungen in einem Posteingang voller E-Mails zu verfolgen.

Hier haben wir die Betreffzeile der E-Mails ge√§ndert, um Kundenbestellung und dann den Kundennamen zu lesen. Wir verwenden Show Smart Tags, um das Namensfeld in die Betreffzeile einzuf√ľgen.

√Ąndern Sie die Betreffzeile in der Benachrichtigungs-E-Mail, um den Kundennamen hinzuzuf√ľgen

Sie k√∂nnen auch andere gew√ľnschte Details √§ndern.

Wir empfehlen au√üerdem dringend, eine E-Mail-Benachrichtigung f√ľr Ihre Kunden einzurichten. Dies erinnert Sie daran, was sie bestellt haben, und informiert sie dar√ľber, dass Sie ihre Bestellung erhalten haben.

Um eine neue E-Mail-Benachrichtigung einzurichten, klicken Sie auf die Schaltfl√§che Neue Benachrichtigung hinzuf√ľgen.

Klicken Sie auf die Schaltfl√§che "Neue Benachrichtigung hinzuf√ľgen", um eine neue Benachrichtigung zu erstellen

Sie werden aufgefordert, einen Namen f√ľr die neue Benachrichtigung einzugeben. Sie k√∂nnen es so nennen, wie Sie m√∂chten, da Kunden diesen Namen nicht sehen. Wir empfehlen so etwas wie Kundenbeleg oder Kunden-E-Mail-Best√§tigung.

Eingabe eines Namens f√ľr die Benachrichtigung, die an den Kunden gesendet werden soll

Sie möchten, dass die E-Mail-Lieferadresse das E-Mail-Konto Ihres Kunden ist. Löschen Sie {admin_email} aus diesem Feld. Klicken Sie auf Smart Tags anzeigen und wählen Sie das Feld E-Mail.

Richten Sie den Kundenbeleg ein, der per E-Mail an den Kunden gesendet werden soll

Sie m√∂chten auch andere Details f√ľr die E-Mail eingeben. Wir empfehlen die Verwendung einer Betreffzeile wie Ihre Bestellung mit und Ihres Firmennamens.

Eingabe des 'Von'-Namens und der E-Mail-Adresse f√ľr den Kundenbeleg

Im Feld Nachricht m√∂chten Sie Ihrem Kunden wahrscheinlich eine Nachricht hinzuf√ľgen. Das Tag {all_fields} gibt Ihnen alle Informationen, die der Kunde in das Formular eingegeben hat.

Bearbeiten Sie die E-Mail-Adresse, die Ihr Kunde erhalten wird

Was ist, wenn Sie nur einige der Kundeninformationen in die E-Mail aufnehmen m√∂chten? Oder was ist, wenn Sie Ihre Bestelldaten an die erste Stelle setzen und Ihre Lieferdaten am Ende der E-Mail angeben m√∂chten? Sie k√∂nnen einfach Smart Tags verwenden, um Ihrem Formular ein beliebiges Formularfeld hinzuzuf√ľgen.

Wenn Sie mit dem Einrichten der Benachrichtigungen fertig sind, klicken Sie oben auf dem Bildschirm auf die Schaltfläche Speichern.

Tipp: Scrollen Sie einfach auf dem Bildschirm nach unten, um zur ersten Benachrichtigung zur√ľckzukehren, die Sie bearbeitet haben.

Richten Sie eine Best√§tigungsnachricht f√ľr Ihre Kunden ein

Zusätzlich zum Senden einer E-Mail-Quittung an Ihre Kunden möchten Sie ihnen eine Bestätigung auf dem Bildschirm anzeigen, damit sie wissen, dass ihre Bestellung versandt wurde.

Sie k√∂nnen dies unter tun Konfiguration ¬ĽBest√§tigung Zunge.

Die Standardbest√§tigung lautet Vielen Dank, dass Sie uns kontaktiert haben! Wir werden uns in K√ľrze bei Ihnen melden.

Standardbest√§tigungsnachricht f√ľr Online-Bestellformular

Sie können dies nach Belieben ändern und hier auch den visuellen Editor verwenden, um Ihren Text zu formatieren.

Personalisieren Sie die Bestätigungsmeldung, die Ihr Client auf Ihrem Bildschirm sehen wird

Alternativ können Sie Kunden auf eine Danke -Seite auf Ihrer Website oder sogar auf eine andere Website umleiten.

Nachdem Sie die Bestätigungsmeldung konfiguriert haben, klicken Sie oben auf dem Bildschirm auf Speichern.

Integrieren Sie die Zahlung in Ihr Bestellformular (optional)

Wenn Sie die Zahlung √ľber Ihr Bestellformular vornehmen m√∂chten, m√ľssen Sie diese in einen Zahlungsabwickler integrieren.

WPForms l√§sst sich sehr einfach in zwei beliebte Zahlungsabwickler, PayPal und Stripe, integrieren. Kunden k√∂nnen √ľber ihr PayPal-Konto oder durch Eingabe ihrer Kreditkartendaten bezahlen.

In diesem Tutorial werden wir PayPal verwenden, aber der Prozess f√ľr Stripe ist √§hnlich.

Zun√§chst m√ľssen Sie den Formular-Generator beenden. Sie k√∂nnen dies tun, indem Sie oben rechts auf das X klicken. Sie werden aufgefordert, Ihr Formular zu speichern, wenn Sie nicht gespeicherte √Ąnderungen vorgenommen haben.

Dann geh zu WPForms ¬ĽPlugins Seite in Ihrem WordPress-Dashboard. Scrollen Sie zum PayPal Standard Plugin und klicken Sie darunter auf die Schaltfl√§che Plugin installieren.

Installieren des PayPal-Plug-Ins f√ľr WPForms

Das Plugin wird automatisch installiert und aktiviert.

Gehen Sie zur√ľck zu Ihrem Formular, das Sie unter finden WPForms ¬ĽAlle Formulare. Klicken Sie nun auf die Registerkarte Zahlungen.

Wählen Sie Zahlungsdienste aus, die in Ihr Formular integriert werden sollen

Klicken Sie auf Standard PayPal und f√ľllen Sie die Formulardetails aus. Zun√§chst m√ľssen Sie das Kontrollk√§stchen Standard-PayPal-Zahlungen aktivieren aktivieren und die PayPal-E-Mail-Adresse Ihres Unternehmens eingeben.

Lassen Sie das Dropdown-Men√ľ Modus auf Produktion und Zahlungsart auf Produkte und Dienstleistungen eingestellt.

Die PayPal-Zahlungseinrichtungsseite f√ľr Ihr Formular

Wenn Sie die Lieferadresse √ľber das Bestellformular abholen, k√∂nnen Sie Versand in Adresse nicht anfordern √§ndern.

Sie m√ľssen keine URL abbrechen eingeben, k√∂nnen jedoch eine Seite auf Ihrer Website erstellen, die an Kunden gesendet wird, wenn diese den Kaufvorgang nicht abschlie√üen.

Klicken Sie auf die Schaltfläche Speichern, wenn Sie fertig sind.

Wenn der Benutzer das Formular abschickt, wird er automatisch zur Zahlung an PayPal weitergeleitet. Sie m√ľssen Ihrem Formular keine zus√§tzlichen Felder hinzuf√ľgen oder etwas anderes tun.

F√ľgen Sie das Bestellformular Ihrer Website hinzu

Der letzte Schritt besteht darin, Ihr Bestellformular zu Ihrer Website hinzuzuf√ľgen.

W√§hlen Sie einfach die Seite aus, zu der Sie Ihr Formular hinzuf√ľgen m√∂chten, oder erstellen Sie eine neue Seite in Seiten ¬ĽNeu hinzuf√ľgen.

Klicken Sie dann auf das Symbol (+), um einen neuen Block hinzuzuf√ľgen (wo Sie Ihr Formular haben m√∂chten) und suchen Sie nach dem Block WPForms. Es befindet sich im Abschnitt Widgets der Bl√∂cke, oder Sie k√∂nnen einfach WPForms in die Suchleiste eingeben, um es zu finden.

F√ľgen Sie Ihr Online-Bestellformular einer Seite Ihrer Website hinzu

Sie sehen einen Block von WPForms. Klicken Sie auf das Dropdown-Men√ľ Formular ausw√§hlen und w√§hlen Sie Ihr Formular aus.

Wählen Sie Ihr Online-Bestellformular aus der Dropdown-Liste WPForms aus

Dann sehen Sie eine Vorschau des Formulars im WordPress-Editor.

Wenn Sie bereit sind, speichern und veröffentlichen (oder aktualisieren) Sie Ihre Seite. Sie können es live auf ihrer Website sehen, um ihre Form in Aktion zu sehen. Bevor Sie es an Kunden weitergeben, empfehlen wir, das Formular zu testen, um sicherzustellen, dass es wie erwartet funktioniert.

Es ist auch eine gute Idee, zu √ľberpr√ľfen, ob Sie die E-Mail-Benachrichtigung erhalten, wenn das Formular gesendet wird. Wenn nicht, lesen Sie unseren Beitrag dar√ľber, wie Sie das WordPress-Problem beheben k√∂nnen, dass keine E-Mails gesendet werden.

Selbst wenn Sie eine E-Mail verlieren oder versehentlich l√∂schen, speichert WPForms die Formulardaten in der WordPress-Datenbank. Sie finden alle Ihre Bestellungen unter WPForm ¬ĽTickets in Ihrem WordPress-Dashboard.

Klicken Sie auf den Namen Ihres Formulars und Sie sehen eine Liste der Einträge. Sie können neben diesen auf Anzeigen klicken, um die Details anzuzeigen.

Zeigen Sie ausgef√ľllte Bestellformulare in Ihrem WordPress-Dashboard an

Das wars! Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie ein Online-Bestellformular in WordPress erstellen. Vielleicht gef√§llt Ihnen auch unser Leitfaden zu den besten Gesch√§ftstelefondiensten, und Sie m√ľssen √ľber die WordPress-Plugins f√ľr kleine Unternehmen verf√ľgen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie unseren Kanal YouTube um WordPress-Tutorial-Videos anzusehen. Sie finden uns auch auf Twitter y Facebook.

Your Header Sidebar area is currently empty. Hurry up and add some widgets.