Früher dachte ich, dass man für den Online-Verkauf eines Produkts eine umfangreiche E-Commerce-Lösung braucht. Ich erinnere mich, dass ich tagelang komplexe Warenkörbe konfiguriert habe, nur um ein einfaches E-Book zu verkaufen. Das war völlig übertrieben.
In dieser Anleitung zeige ich Ihnen genau, wie Sie eine Landing Page mit einem Zahlungsgateway erstellen. Ich werde SeedProd verwenden, da es das Design und die Stripe-Verbindung an einem Ort vereint. Wenn Sie nur einen Button für einen bestehenden Beitrag benötigen, zeige ich Ihnen auch WP Simple Pay als schnelle Alternative.
Warum eine Payment Gateway Landing Page erstellen?
Wenn Kunden direkt auf Ihrer Landing Page bezahlen können, geht der Bezahlvorgang schneller, weniger Leute verlassen die Seite ohne zu kaufen und der Umsatz steigt.
Wenn Sie Kunden auf eine separate Checkout-Seite weiterleiten, haben sie mehr Zeit zum Zögern. Indem Sie die Zahlungsoption direkt auf Ihrer Landing Page platzieren, beseitigen Sie diese Hindernisse und erleichtern es ihnen, spontan zu kaufen.
Sie können die Konversionsrate auch steigern, indem Sie mehrere Zahlungsmethoden anbieten, wie Kreditkarten, PayPal oder digitale Geldbörsen. Branchenstudien zeigen, dass Unternehmen, die mehr Auswahlmöglichkeiten bieten, einen Umsatzanstieg von bis zu 30 % verzeichnen.
Dieser Ansatz ist sehr kostengünstig. Sie müssen keinen riesigen Online-Shop aufbauen, um mit dem Verkauf zu beginnen. Sie können sogar eine neue Produktidee mit einem einfachen kostenlosen Landingpage-Konzept validieren, bevor Sie auf eine kostenpflichtige Gateway-Konfiguration umsteigen.
Nachdem Sie nun wissen, warum dies so effektiv ist, wollen wir uns nun den wichtigsten Komponenten zuwenden, die Sie für die Einrichtung eines solchen Systems benötigen.
Was Sie für die Annahme von Zahlungen auf einer Landing Page benötigen
Um Zahlungen direkt auf Ihrer WordPress-Landingpage zu akzeptieren, benötigen Sie einige Schlüsselkomponenten, die den Prozess sicher und zuverlässig machen.
- Ein Zahlungsabwickler: Ein Zahlungsabwickler wie Stripe, PayPal oder Square ist ein Dienst, der finanzielle Transaktionen zwischen Ihrer Website und der Bank Ihres Kunden abwickelt. Er verarbeitet sicher Zahlungen mit Kreditkarten, Debitkarten und digitalen Brieftaschen.
- SSL-Zertifikat: Stellen Sie sich ein SSL-Zertifikat (Secure Sockets Layer) wie ein digitales Schloss vor. Es sichert die Verbindung zwischen dem Browser Ihres Besuchers und Ihrem Server, sodass sensible Daten wie Kreditkartennummern geschützt bleiben.
- PCI-Einhaltung: Hierbei handelt es sich um eine Reihe von Sicherheitsvorschriften für den Umgang mit Kreditkartendaten. Das hört sich technisch an, aber die gute Nachricht ist, dass moderne Zahlungsabwickler wie Stripe so konzipiert sind, dass sie die komplexen Teile für Sie übernehmen. Sie wickeln Zahlungen auf ihren sicheren Servern ab, was Ihre Compliance-Anforderungen vereinfacht und die Kundendaten schützt.
- Ein sicherer Hosting-Anbieter: Wählen Sie einen vertrauenswürdigen WordPress-Hosting-Anbieter, der über integrierte Sicherheitsfunktionen und SSL-Unterstützung verfügt, wie beispielsweise Bluehost oder SiteGround. Zuverlässiges Hosting sorgt dafür, dass Ihr Zahlungssystem schnell und sicher bleibt.
Die meisten modernen Page Builder mit Zahlungsintegrationen, wie SeedProd, übernehmen die technischen Details für Sie. Dadurch dauert die Einrichtung nur wenige Minuten.
Schritte zum Erstellen einer Landing Page mit Payment Gateway
In diesem Tutorial zeige ich Ihnen, wie Sie mit SeedProd eine Landingpage für ein Zahlungsgateway in WordPress erstellen können. SeedProd ist ein leistungsstarker WordPress-Seitenersteller und Website-Builder, mit dem Sie ohne Programmierkenntnisse individuelle Layouts erstellen können. Ich verwende SeedProd für dieses Tutorial, weil die direkte Stripe-Integration den Vorgang unglaublich einfach macht.
Mit SeedProd können Sie Ihr Seitendesign leicht erstellen, eine Zahlungsschaltfläche hinzufügen und Ihre Landing Page in wenigen Minuten veröffentlichen. Sie folgen ein paar einfachen Schritten: Installieren Sie SeedProd, wählen Sie eine Vorlage, ziehen Sie den Zahlungsbutton-Block hinein, verbinden Sie ihn mit Ihrem Stripe-Konto und gehen Sie live.
Gehen wir Schritt für Schritt vor, wie man es einrichtet.
Schritt 1. Installieren und aktivieren Sie den SeedProd Landing Page Builder
Navigieren Sie zunächst zur SeedProd-Preisseite, um Ihre Kopie des Plugins zu erhalten. Hinweis: Sie benötigen den SeedProd Pro- oder Elite-Tarif, um auf den in diesem Tutorial verwendeten Zahlungsbutton-Block zugreifen zu können.
Nachdem Sie die Plugin-Datei heruntergeladen haben, laden Sie sie in Ihr WordPress-Dashboard hoch. Wenn Sie dabei Hilfe benötigen, können Sie dieser Anleitung zur Installation eines WordPress-Plugins folgen.
Sobald das Plugin aktiv ist, navigieren Sie zur Seite „SeedProd » Einstellungen“ und fügen Sie Ihren Lizenzschlüssel ein, um die Einrichtung abzuschließen.
Klicken Sie anschließend auf die Schaltfläche „Schlüssel überprüfen“, um den Vorgang abzuschließen.
Schritt 2. Wählen Sie eine Landing Page-Vorlage
Nachdem Sie das Plugin aktiviert haben, wählen Sie als Nächstes eine Vorlage aus. Gehen Sie dazu zuSeedProd » Landing Pagesund klicken Sie auf die SchaltflächeAdd New Landing Page(Neue Landing Page hinzufügen).
Dadurch wird eine Bibliothek mit professionell gestalteten Landingpage-Vorlagen geöffnet.
Um ein passendes Design zu finden, klicke ich auf den Filter „Verkäufe“ und wähle die Vorlage „eBook-Verkaufsseite“ aus.
Wenn Sie ein Design gefunden haben, das Ihnen gefällt, bewegen Sie den Mauszeiger darüber und klicken Sie auf das Häkchen-Symbol.
Es erscheint ein Popup-Fenster, in dem Sie aufgefordert werden, einen Seitennamen und eine URL einzugeben. Nachdem Sie diese Angaben gemacht haben, klicken Sie auf die Schaltfläche„Speichern und mit der Bearbeitung der Seite beginnen“, um den Builder zu starten.
Schritt 3. Hinzufügen einer Stripe-Zahlungsgateway-Schaltfläche
Sobald die Vorlage geladen ist, wird der visuelle Seitenersteller SeedProd angezeigt.
Das Layout ist intuitiv, mit Inhaltsblöcken auf der linken Seite und einer Live-Vorschau meiner Seite auf der rechten Seite. Um etwas anzupassen, musste ich nur darauf klicken. Ich habe zum Beispiel auf die Hauptüberschrift geklickt und meinen neuen Text direkt in die Vorschau eingegeben.
Nachdem die Vorlage geladen wurde, suchen Sie im linken Bereich nach dem Block „Zahlungsbutton“ und ziehen Sie ihn direkt auf Ihre Seite. Dieser Block eignet sich ideal für den Verkauf einzelner Artikel, wie z. B. eines E-Books oder eines Webinar-Tickets, und nicht für einen ganzen Warenkorb mit Produkten.
Nachdem Sie den Block platziert haben, werden seine Einstellungen auf der linken Seite geöffnet. Klicken Sie auf die Schaltfläche „Mit Stripe verbinden “. Dadurch gelangen Sie zur Stripe-Website, wo Sie Ihr bestehendes Konto verknüpfen oder ein neues Konto erstellen können. Sobald Sie fertig sind, gelangen Sie direkt zurück zum Editor.
Wenn Stripe verbunden ist, kannst du die Zahlungsdetails konfigurieren. Leg den Zahlungsbetrag, die Währung und eine kurze Beschreibung fest.
Apropos Weiterleitungen: Sie müssen dem Button mitteilen, wohin die Besucher nach dem Kauf weitergeleitet werden sollen. Fügen Sie den Link zu Ihrer Dankesseite in das Feld „Erfolgs-URL“ ein.
Nachdem Sie die Zahlungseinstellungen vorgenommen haben, passen Sie das Seitendesign weiter an, bis Sie damit zufrieden sind. Denken Sie vor allem daran, auf die Schaltfläche „Speichern“ in der oberen rechten Ecke zu klicken, um Ihre Änderungen zu speichern.
Schritt 4. Konfigurieren Sie Ihre Einstellungen
Klicken Sie vor der Veröffentlichung oben auf dem Bildschirm auf die Registerkarte „Seiteneinstellungen“, um einige Details zu finalisieren. Überprüfen Sie in den allgemeinen Einstellungen, ob der Name Ihrer Seite und die URL korrekt sind.
Klicken Sie dann auf die Registerkarte „SEO “. Da ich All in One SEO installiert habe, konnte ich meinen SEO-Titel und meine Meta-Beschreibung direkt im Builder konfigurieren.
Sie können auch die Registerkarte „Verbinden“ aufrufen, um Optionen für die Verknüpfung eines E-Mail-Marketing-Dienstes anzuzeigen. Dies ist eine großartige Funktion für Follow-up-Kampagnen.
Schritt 5. Veröffentlichen Sie Ihre Payment Gateway Landing Page
Wenn Sie bereit sind, Ihre Seite live zu schalten, klicken Sie auf die Schaltfläche Speichern und wählen Sie die Option Veröffentlichen.
Besuchen Sie anschließend Ihre Live-Seite, um sie zu testen. Wenn Besucher nun auf die Schaltfläche „Bezahlen“ klicken, können sie den Kaufvorgang über Stripe abschließen.
Alternative: Hinzufügen eines Stripe-Buttons mit WP Simple Pay
Wenn Sie bereits ein Design für eine Landing Page haben und nur eine Zahlungsfunktion hinzufügen möchten, dann ist WP Simple Pay eine ausgezeichnete, leichtgewichtige Lösung. Es ist ein spezielles Stripe-Zahlungsplugin, mit dem Sie eine "Jetzt kaufen"-Schaltfläche zu jedem Beitrag oder jeder Seite hinzufügen können, ohne eine komplexe Einrichtung vornehmen zu müssen.
Das Verfahren ist sehr schnell. Nach der Installation des Plugins führt Sie ein Einrichtungsassistent durch die Verbindung mit Ihrem Stripe-Konto.
Von dort aus erstellen Sie ein neues Zahlungsformular, wählen "Zahlungsbutton" und legen Ihren Preis und Ihre Währung fest.
Nach dem Speichern können Sie die Schaltfläche mithilfe des mitgelieferten WP Simple Pay-Blocks oder eines Shortcodes zu Ihrer Landing Page hinzufügen.
Häufig gestellte Fragen zu Landing Pages mit Zahlungsgateways
Bonus-Leitfäden für eCommerce-Websites
Nachdem Sie nun wissen, wie Sie einfache Zahlungen auf einer Landing Page akzeptieren können, könnte der nächste logische Schritt der Aufbau eines kompletten Online-Shops sein. Diese Anleitungen werden Ihnen dabei helfen:
- Hinzufügen einer benutzerdefinierten Schaltfläche "Add-to-Cart" in WooCommerce
- Anzeige von Produktkategorien und Tags in WooCommerce
- Wie Sie Ihre WooCommerce Shop-Seite leicht anpassen können
Vielen Dank fürs Lesen! Wir würden uns freuen, Ihre Meinung zu hören. Bitte beteiligen Sie sich an der Konversation auf YouTube, X und Facebook, um weitere hilfreiche Ratschläge und Inhalte für das Wachstum Ihres Unternehmens zu erhalten.
