loader image

Radiboxes Server machen WordPress Websites bis zu 4x schneller - ohne zusätzliche Optimierung. Raidboxes migriert deine Website und du kannst selbst vergleichen. Wenn du zufrieden bist, wähle einfach das passende Paket in deren Preistabelle.

4.97

Sehr gut

trustedshops.de

Autor

duckducknews

Wie WooCommerce Checkout-Seite anpassen (The Easy Way)

Möchten Sie Ihre WooCommerce-Kassenseite individuell gestalten?

Die Standard-Kassenseite von WooCommerce ist nicht für Konversionen optimiert. Durch die Anpassung und Optimierung Ihrer Kassenseite können Sie Ihre Konversionen erhöhen und mehr Umsatz machen.

In diesem Artikel zeigen wir Ihnen, wie Sie Ihre WooCommerce-Kassenseite ganz einfach anpassen können, Schritt für Schritt, ohne Code zu schreiben.

How to customize WooCommerce checkout page (the easy way)

Warum sollten Sie die WooCommerce-Kassenseite in WordPress anpassen?

Studien zeigen, dass zwischen 70 und 85 % aller Warenkörbe abgebrochen werden. Mit anderen Worten, die Mehrheit der Nutzer verlässt Ihre Kassenseiten, ohne einen Kauf zu tätigen.

Die Erstellung einer benutzerdefinierten WooCommerce-Kassenseite bietet Ihnen eine letzte Gelegenheit, einen Website-Besucher in einen Kunden zu verwandeln, bevor er Ihren Shop verlässt.

Mit einer benutzerdefinierten Kassenseite können Sie Testimonials / Social-Proof-Elemente hinzufügen, um Vertrauen aufzubauen, verwandte Produkte hinzufügen, um den Umsatz zu steigern, und das gesamte Seitenlayout für bessere Konversionen optimieren.

Checkout page example

All dies erhöht die Konversionsrate und macht es wahrscheinlicher, dass Ihr Besucher zu einem langfristigen Kunden wird.

Bevor Sie weitermachen, möchten Sie vielleicht auch Ihre WooCommerce-Warenkorb-Seite anpassen, um die Konversionen auch hier zu verbessern.

Wenn Sie die WooCommerce-Warenkorb- und Kassenseiten zusammen verwenden, sollten diese Seiten ein ähnliches Branding haben, um Ihren Besuchern ein großartiges Kassiererlebnis zu bieten.

Indem Sie diese Seiten gemeinsam anpassen, können Sie Ihre Konversionen insgesamt verbessern und mehr Umsatz erzielen. Weitere Details finden Sie in unserem Leitfaden zum Erstellen einer benutzerdefinierten WooCommerce-Warenkorb-Seite, ohne Code zu schreiben.

Lassen Sie uns also einen Blick darauf werfen, wie Sie Ihre WooCommerce-Kassenseite leicht anpassen und mehr Geld mit Ihrem Online-Shop verdienen können.

Wie Sie Ihre WooCommerce-Kassenseite in WordPress anpassen können

SeedProd ist der beste Drag-and-Drop-WordPress-Seitenersteller, der von über 1 Million Websites verwendet wird. Mit ihm können Sie Ihre WooCommerce-Kassenseite leicht anpassen, um mehr Umsatz zu machen.

Als erstes müssen Sie das Plugin installieren und aktivieren. Weitere Einzelheiten finden Sie in unserer Schritt-für-Schritt-Anleitung für die Installation eines WordPress-Plugins.

Hinweis: Es gibt eine kostenlose Version von SeedProd, die verfügbar ist, aber für dieses Tutorial werden wir die Pro-Version zeigen, da sie integrierte WooCommerce-Blöcke hat.

Sobald das Plugin aktiviert ist, gehen Sie zu SeedProd “ Einstellungen und geben Sie Ihren Lizenzschlüssel ein.

SeedProd license key

Sie finden diese Informationen unter Ihrem Konto auf der SeedProd-Website.

Navigieren Sie danach zu SeedProd “ Seiten und klicken Sie dann auf die Schaltfläche „Neue Landing Page hinzufügen“.

Add new SeedProd landing page

Als nächstes werden Sie aufgefordert, eine Landing Page-Vorlage auszuwählen. Es gibt Dutzende von professionell gestalteten Vorlagen, aus denen Sie wählen können.

Sie werden feststellen, dass die Vorlagen nach verschiedenen Kategorien gefiltert sind. Wenn Sie eine Vorlagenkategorie wählen, die dem Typ der Seite entspricht, die Sie erstellen möchten, können Sie Ihre Seite schneller erstellen.

Unabhängig davon kann jede Vorlage vollständig angepasst werden, unabhängig davon, welche Vorlage Sie wählen.

Für dieses Tutorial wählen wir die Vorlage „Blank“, da wir damit genau die Art von Checkout-Seite erstellen können, die wir wollen.

Um eine Vorlage auszuwählen, bewegen Sie den Mauszeiger über die Vorlage und klicken Sie auf das Symbol „Häkchen“.

Select blank SeedProd template

Danach werden Sie aufgefordert, Ihre Seite zu benennen. Der Name der Seite muss auch mit der URL Ihrer Kassenseite übereinstimmen.

Klicken Sie dann auf die Schaltfläche „Speichern und mit der Bearbeitung der Seite beginnen“.

Name checkout page

Dadurch gelangen Sie zum Drag-and-Drop-Editor, mit dem Sie Ihre individuelle WooCommerce-Kassenseite erstellen können.

Auf der rechten Seite sehen Sie eine Seitenvorschau, und auf der linken Seite finden Sie das Optionsfeld, das Ihnen bei der Anpassung hilft.

Zunächst fügen wir eine Kopfzeile hinzu, damit Sie Ihr Branding beibehalten können.

Klicken Sie dazu auf die Menüoption „Abschnitte“ im linken Bereich und dann auf die Kategorie „Kopfzeile“.

Insert header section

Bewegen Sie dann den Mauszeiger über die Vorlage „Kopfzeile 1“ und klicken Sie auf das Symbol „Plus“.

Klicken Sie anschließend auf den Abschnitt „Bild“ Ihrer Seite und laden Sie Ihr Ladenlogo im linken Menü hoch.

Add header logo

Anschließend können Sie das Navigationsmenü löschen, indem Sie mit dem Mauszeiger darauf fahren und auf „Block löschen“ klicken.

Durch das Löschen der anderen Menüpunkte wird die Anzahl der Seitenabbrüche reduziert und die Wahrscheinlichkeit erhöht, dass Ihr Besucher den Kauf abschließt.

Delete menu block

Klicken Sie anschließend auf die Schaltfläche mit der Aufschrift „Aufruf zum Handeln“.

Wir werden den Text so ändern, dass er „Warenkorb anzeigen“ lautet.

Edit button text

So können Ihre Nutzer zurück zu ihrer Einkaufswagenseite gehen, um Artikel hinzuzufügen oder die Menge zu ändern.

Fügen Sie dann die URL Ihrer WooCommerce-Warenkorbseite in das Feld mit der Bezeichnung „Link“ ein.

Sie können den Link auf „nofollow“ setzen oder in einem neuen Tab öffnen, aber wir belassen es bei den Standardeinstellungen.

Edit button URL

Als Nächstes klicken Sie auf das Layout für Inhalt und Seitenleiste im Abschnitt „Wählen Sie Ihr Layout:“.

So können Sie einen Bereich für Ihre Kasse sowie einen Bereich für empfohlene Produkte erstellen.

Select two column layout

Danach suchen Sie den Block „Kasse“ im Abschnitt WooCommerce und ziehen ihn auf Ihre Seite.

Sie können das Aussehen Ihrer Kasse vollständig anpassen, einschließlich Farbschema, Schriftart, Linkfarbe, Schaltflächen und mehr.

Add checkout block

Als Nächstes können Sie einen Bereich für beliebte Produkte oder empfohlene Produkte hinzufügen. Auf diese Weise können Sie Ihre Verkäufe steigern, indem Sie andere Produkte bewerben, an denen Kunden interessiert sein könnten.

Ziehen Sie dazu einfach den Block „Meistverkaufte Produkte“ aus dem Bereich „WooCommerce“ auf.

Sie können auch einen der anderen WooCommerce-Produktblöcke auswählen.

Add WooCommerce products block

Als nächstes können Sie eine Überschrift über den beliebten Produkten hinzufügen.

Ziehen Sie einfach den Block „Überschrift“ auf Ihre Seite über die beliebten Produkte. Sie können die Schriftart, die Größe, den Text, die Farbe und vieles mehr anpassen.

Add product headline block

Sobald Sie das getan haben, können Sie einen Block mit Erfahrungsberichten hinzufügen. Dieser dient als sozialer Beweis und gibt Ihren Besuchern die Gewissheit, dass sie die richtige Entscheidung treffen.

Suchen Sie den Block „Testimonials“ und ziehen Sie ihn unter Ihre beliebten Produkte.

Add testimonials block

Der Block „Testimonials“ kann vollständig angepasst werden.

Sie können ein Kundenfoto, eine Berufsbezeichnung und mehr hinzufügen.

Customize testimonials block

Eine weitere Möglichkeit, den sozialen Beweis zu verbessern, ist das Hinzufügen einer Sterne-Bewertung direkt unter Ihrem Erfahrungsbericht.

Wählen Sie einfach den Block „Sternchenbewertung“ aus und ziehen Sie ihn unter Ihr Zeugnis.

Add star rating block

Nachdem Sie Ihre WooCommerce-Kassenseite angepasst haben, können Sie sie live schalten, indem Sie auf den Dropdown-Pfeil neben der Schaltfläche „Speichern“ klicken und „Veröffentlichen“ auswählen.

Publish checkout page

Jetzt haben Sie anstelle der standardmäßigen WooCommerce-Kasse eine hoch konvertierende WooCommerce-Kassenseite erstellt.

Sie können Ihre Seite weiter anpassen und verschiedene Elemente, Abschnitte und Blöcke ausprobieren.

WooCommerce checkout page example

Pro-Tipp: Sie können die Leistung Ihrer WooCommerce-Kassenseite verfolgen, um zu sehen, ob Ihre Anpassungen den Umsatz steigern. Weitere Details finden Sie in unserer Schritt-für-Schritt-Anleitung zur Einrichtung von WooCommerce-Conversion-Tracking.

Zuweisung Ihrer Checkout-Seite zu WooCommerce

Sobald Sie die Anpassung Ihrer Kassenseite abgeschlossen und sie aktiviert haben, müssen Sie die Standard-URL-Einstellungen von WooCommerce ändern.

Wenn Sie die URL ändern, werden Ihre Kunden automatisch auf Ihre neue WooCommerce-Kassenseite weitergeleitet, anstatt auf die Standardoption.

Gehen Sie zunächst zu WooCommerce “ Einstellungen und klicken Sie auf die Registerkarte „Erweitert“.

Change WooCommerce cart URL

Wählen Sie dann die neue URL der WooCommerce-Kassenseite aus dem Dropdown-Menü aus.

Klicken Sie unten auf dem Bildschirm auf „Änderungen speichern“.

Wenn ein Besucher nun auf „Zur Kasse gehen“ klickt, wird er zu Ihrer neuen, hoch konvertierenden Seite weitergeleitet, die Sie gerade erstellt haben.

Einige WooCommerce-Themes bieten Kunden sogar die Möglichkeit, direkt zur Kassenseite zu gehen.

Direct to checkout example

Wie Sie den Abbruch von Kaufvorgängen reduzieren können

Ein Abbruch der Kaufabwicklung liegt vor, wenn ein Kunde den Kaufprozess beginnt, aber die Zahlung nicht abschließt. Es ist ähnlich wie der Abbruch des Einkaufswagens, aber es ist ein weiterer Schritt auf dem Weg zum Abschluss der Zahlung und zum Kunden.

Wenn Sie Ihre Checkout-Seite mit Hilfe des obigen Tutorials anpassen, können Sie Ihre Checkout-Seite für Conversions optimieren.

Es gibt jedoch ein paar Dinge, die Sie tun können, um die Zahl der Kaufabbrüche weiter zu reduzieren.

Reduzieren Sie die Gebühren für Addon-Checkouts

Wenn Kunden in den Warenkorb gehen, erwarten sie, dass der Gesamtpreis ähnlich hoch ist wie der Gesamtpreis des Produkts.

Wenn sie zur Kasse gehen und Steuern, hohe Versandkosten und andere zusätzliche Gebühren sehen, ist die Wahrscheinlichkeit groß, dass sie den Kauf nicht abschließen werden.

Added fees example

Ein Kunde könnte mit dem Kauf fortfahren, wenn er die Kosten für gerechtfertigt hält. Am besten ist es jedoch, wenn Sie bei der Preisgestaltung ehrlich sind.

Wenn Sie viele zusätzliche Gebühren für die Lieferung Ihrer Produkte erheben, sollten Sie diese auf den Gesamtpreis Ihrer Produkte aufschlagen. Oder Sie erklären den Grund für die zusätzlichen Kosten.

Amazon konnte den eCommerce-Bereich durch das Angebot eines kostenlosen 2-Tage-Versands dominieren.

Ziehen Sie in Erwägung, für Ihre Produkte einen kostenlosen Versand anzubieten, oder bieten Sie einen kostenlosen Versand für Bestellungen ab einem bestimmten Betrag an.

Machen Sie die Kontoerstellung optional oder einfacher

Wenn Sie vor dem Abschluss eines Kaufs die Registrierung eines Kontos verlangen, kann dies zu Kaufabbrüchen führen. Dadurch können Sie zwar mehr E-Mail-Abonnenten gewinnen, aber der Kaufprozess wird dadurch erschwert.

Sie können Ihren Nutzern die Möglichkeit geben, ein Konto zu erstellen, aber Sie müssen dies nicht zur Bedingung machen.

Stattdessen können Sie ein Registrierungsformular einrichten, um Ihre E-Mail-Liste zu erweitern, nachdem der Nutzer seinen Kauf abgeschlossen hat.

Sie können auch die erforderlichen Felder auf der Kassenseite vereinfachen. Wenn Sie weitere Informationen erfassen müssen, können Sie dies nach der Kaufabwicklung tun.

Das Ziel sollte sein, so viele Felder (Reibungspunkte) aus dem Weg zu räumen, damit der Benutzer den Kauf abschließen kann.

Bieten Sie mehr Checkout-Zahlungsoptionen an

Ein weiterer Grund, warum Ihre Besucher den Checkout-Prozess nicht durchlaufen, ist, dass Sie nicht genügend Zahlungsoptionen anbieten.

Ihr Online-Shop sollte die gängigsten Zahlungsoptionen anbieten.

Payment options example

Ihre Kunden werden die Zahlungsmethode nutzen, die für sie am bequemsten ist.

Weitere Details finden Sie in unserer Liste der besten WooCommerce-Zahlungsgateways für WordPress.

Wir hoffen, dass dieser Artikel Ihnen geholfen hat, die WooCommerce-Kassenseite einfach anzupassen. Vielleicht interessieren Sie sich auch für unsere Expertenauswahl des besten WooCommerce-Hostings und unsere Liste der besten WooCommerce-Plugins für Ihren Shop.

Wenn Ihnen dieser Artikel gefallen hat, dann abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Videotutorials. Sie können uns auch auf Twitter und Facebook finden.

Die beliebtesten Beiträge

Wie man den ungültigen JSON-Fehler in WordPress behebt (Anleitung für Anfänger)

Versuchen Sie, den ungültigen JSON-Fehler in WordPress zu beheben? Dieser Fehler tritt auf, wenn Sie WordPress-Beiträge oder -Seiten auf Ihrer Website bearbeiten. Sie erhalten die Meldung "Die Antwort ist keine gültige JSON-Antwort" und die Aktualisierung der Seite schlägt fehl. In diesem Artikel zeigen wir Ihnen, wie Sie den ungültigen JSON-Fehler ...

So beheben Sie den Fehler „Verbindung ist nicht privat“ (Anleitung für Website-Besitzer)

Sehen Sie die Fehlermeldung "Ihre Verbindung ist nicht privat" auf Ihrer WordPress-Website? Dies ist die Fehlermeldung, die Sie in Google Chrome sehen. Der gleiche Fehler wird auf allen modernen Browsern mit leicht unterschiedlichen Meldungen angezeigt und kann für Anfänger bei der Fehlerbehebung etwas verwirrend sein. In dieser Anleitung für Website-Besitzer ...

Wie man eine Seite in voller Breite in WordPress erstellt (Anleitung für Anfänger)

Möchten Sie eine Seite in voller Breite in WordPress erstellen, so dass Sie Ihren Inhalt über den Bildschirm strecken können? Die meisten WordPress-Themes verfügen bereits über eine integrierte Vorlage für eine Seite in voller Breite, die Sie verwenden können. Wenn Ihr Theme jedoch keine hat, dann ist es einfach, sie ...
DSGVO Cookie-Einwilligung mit Real Cookie Banner