German (Deutsch) translation by Alex Grigorovich (you can also view the original English article)
WooCommerce ist die beliebteste und "am meisten anpassbare eCommerce-Plattform für den Aufbau Ihres Online-Business." Sie können WooCommerce kostenlos herunterladen, aber Sie beginnen wirklich seine Macht zu sehen, wenn Sie WordPress WooCommerce Plugins und Themes verwenden.
Aber musst du wirklich ein WooCommerce-Theme verwenden?
Obwohl es nicht erforderlich ist, empfehle ich es sehr.
WooCommerce-Themen sind nicht nur eCommerce-orientiert, das gesamte Thema ist auf WooCommerce-Stile ausgerichtet. Das CSS, mit dem WooCommerce definiert, wie Produkte angezeigt werden, wird dann vom WordPress WooCommerce-Thema verwendet, um wirklich alles zusammen zu ziehen - was für einige der am schönsten gestalteten eCommerce-Ladenfronten sorgt.
Ganz zu schweigen von der Tatsache, dass das Installieren und Einrichten eines neuen WordPress WooCommerce Themes nicht schwieriger ist als das Einrichten eines anderen WordPress Themes.
Lass mich dir zeigen, wie es geht.
So installieren und richten Sie ein neues WordPress WooCommerce Theme ein
Wenn Sie WooCommerce bereits installiert haben, ist das großartig! Wenn nicht, empfehle ich Rachel McCollins Anfängerleitfaden zum Verwenden von WooCommerce. Dies führt Sie in WooCommerce ein und führt Sie durch alle notwendigen Schritte, um Ihre Online-Storefront zum Laufen zu bringen.
Jetzt beginnen wir mit der Installation und Einrichtung eines neuen WordPress WooCommerce Theme.
Schritt 1: Installieren Sie Dummy-Daten
Wenn Sie Ihre Produkte bereits zu WooCommerce hinzugefügt haben, empfehle ich, diesen Schritt zu überspringen und mit Schritt 2 zu beginnen.
Durch die Installation von Dummy-Daten werden Ihrer Storefront fiktive Produkte hinzugefügt, damit Sie Ihr Geschäft mit Produkten besser darstellen können. Nachdem Sie die Installation abgeschlossen und Ihr neues WordPress WooCommerce-Design eingerichtet haben, sollten Sie alle Dummy-Daten löschen, bevor Sie Ihre Produkte hinzufügen. Andernfalls riskieren Sie versehentlich das Löschen Ihrer eigenen Produktdaten.
Die Dummy-Daten sind in Ihrem WooCommerce-Plugin enthalten. Wenn Sie WooCommerce im WordPress-Admin installiert haben, laden Sie das Plugin aus dem WordPress Plugin-Verzeichnis auf Ihren Computer herunter. Dies wird einfacher sein, als sich bei Ihrem FTP-Server anzumelden, in Ihr Plugin-Verzeichnis zu gehen und die Dummy-Daten von dort herunterzuladen.
Sobald der Download abgeschlossen ist, entpacken Sie die Datei, damit Sie Ihre daty-data.xml-Datei importieren können.
Gehen Sie zu Ihren Tools und klicken Sie auf Importieren:
Lassen Sie sich nicht von den "WooCommerce Tax Rates (CSV)" verwirren. Dies kann später gemacht werden, wenn Sie möchten. Für die WooCommerce Dummy-Daten sollten Sie WordPress wählen.
Mehr als wahrscheinlich, dass Sie nicht das WordPress Importer Plugin installiert haben, also gehen Sie voran und installieren Sie jetzt.
Einmal installiert, mach weiter und aktiviere Plugin & Import ausführen.
Erinnerst du dich, wo du das WooCommerce-Plugin heruntergeladen und entpackt hast? Groß! Jetzt müssen Sie auf Datei auswählen klicken und den Weg dorthin finden.
Ihre Dummy-Daten sollten sich in Ihrem entpackten Ordner befinden: (woocommerce.version.number) > woocommerce > dummy-data.
Öffnen Sie den Dummy-Datenordner, wählen Sie dummy-data.xml, und Sie können die Datei hochladen und importieren.
Dies ist das letzte, was Sie tun müssen, bevor Sie alle Dummy-Daten importieren.
Einige davon sind persönliche Vorlieben, aber hier ist, was ich tue (Screenshot weiter unten):
Importieren Sie den Standardautor "wooteam", anstatt einen neuen Autor zu erstellen oder einen bereits existierenden Autor zu verwenden. Auf diese Weise wissen Sie, welche Inhalte in diesem Prozess basierend auf dem Autorennamen importiert / erstellt wurden (ich empfehle, den Autor zu löschen, wenn Sie die Dummy-Daten entfernen, nachdem Sie die Installation und Einrichtung Ihres neuen WordPress WooCommerce-Themes abgeschlossen haben).
Ich empfehle Ihnen auch, Anhänge herunterzuladen und zu importieren, damit Sie jedem Produkt Bilder zuordnen können (auch hier sollten Sie sicherstellen, dass die Medien entfernt werden, wenn Sie mit den Dummy-Daten fertig sind).
Nachdem Sie diese Auswahl getroffen haben, übermitteln Sie Folgendes:
Besuchen Sie yourwebsite.com/shop/ und Sie sollten einen vollständig importierten Test Store sehen:
Ja! Du hast es geschafft!
Es ist nicht sehr gut gestaltet, oder? Gut, dass wir ein großartiges WordPress WooCommerce-Theme wie Savoy installieren werden.
(HINWEIS: Vergessen Sie nach der Installation und Einrichtung Ihres Themes nicht, die Produkte und Bilder aus dem Dummy-Datenimport zu löschen, bevor Sie eigene Produkte hinzufügen.)
Schritt 2: Installieren Sie ein WordPress WooCommerce Theme
Nun schauen wir uns an, wie man WooCommerce Theme installiert. Wenn Sie Ihr WordPress Commerce-Theme noch nicht heruntergeladen haben, laden Sie es auf Ihren Computer herunter (stellen Sie sicher, dass Sie wissen, wo Sie es heruntergeladen haben, damit Sie darauf zugreifen können).
Es gibt zwei verschiedene Möglichkeiten, wie Sie Ihr Theme installieren können:
- Greifen Sie über FTP auf Ihre Website zu
- Aus dem WordPress-Admin
FTP Dein Thema
Wenn Sie mit FTP vertraut sind, gehen Sie weiter und verbinden Sie sich mit Ihrem Server und gelangen Sie in das Verzeichnis wp-content > themes. Hier können Sie Ihr Theme senden. Stellen Sie jedoch sicher, dass Sie Ihr Design senden, bevor Sie den entpackten Ordner an Ihren Server senden. Schauen wir uns das WordPress Theme von ThemeForest einmal genauer an.
Nach dem Entpacken Ihres Downloads sehen Sie, dass es mehrere verschiedene Ordner gibt:
Nicht jedes Thema, das Sie herunterladen, wird so verpackt. Manchmal ist der gezippte Ordner, den Sie herunterladen, der eigentliche Themenordner. Es ist immer eine gute Idee, dies zu überprüfen, da dies von Ort zu Ort variiert.
Das Savoy - Minimalist AJAX WooCommerce Theme enthält einige zusätzliche Dinge wie Dokumentation, Assets, etc. Wenn Sie im Ordner Theme Files nach Savoy suchen, finden Sie Ihr Theme (savoy.zip).
Wenn Sie über FTP installieren, laden Sie den entzippten Theme-Ordner (zum Beispiel: "savoy") in das Themes-Verzeichnis hoch. Wenn Sie nicht sicher sind, ob Sie FTP verwenden oder lieber über den WordPress-Administrator installieren möchten, ist das in Ordnung. Ich bevorzuge auch den WordPress Admin.
Aus dem WordPress-Admin
Zum Installieren eines WordPress-Designs aus dem Admin muss der Themenordner gezippt sein (themefolder.zip). Wie bereits erwähnt, sollten Sie sicherstellen, dass Sie mit dem eigentlichen Themenordner arbeiten und nicht mit dem Ordner, in dem Ihr Thema enthalten sein könnte.
Klicken Sie im WordPress-Admin unter Darstellung auf Designs:
Neues Thema hinzufügen:
Thema hochladen:
Erinnern Sie sich, wo sich die ZIP-Datei Ihres Themes befindet?
(Unser Beispielthema heißt: savoy.zip)
Klicken Sie auf Datei auswählen und gehen Sie zu dieser Datei:
Nach der Installation können Sie in Ihrem WordPress-Admin Darstellung > Themen besuchen, um zu sehen, ob es installiert ist, oder klicken Sie, um es sofort zu aktivieren.
Wie Sie sehen können (siehe unten) sehen, ist das Savoy Thema erfolgreich installiert, so dass die Maus über und aktiviert:
Jetzt, wo dein WordPress WooCommerce Theme erfolgreich installiert und aktiviert wurde, lass es uns einrichten.
Schritt 3: Richten Sie ein WordPress WooCommerce Theme ein
Nicht jedes Thema ist exakt gleich. Wie ein Thema entworfen und entwickelt wird, ist ein großer Faktor, so dass es einige Unterschiede zwischen diesem Tutorial und dem, was Sie möglicherweise haben, gibt. Im Allgemeinen sollte dies jedoch helfen, Ihr WordPress WooCommerce-Theme einzurichten - egal, welches WooCommerce-Theme Sie von ThemeForest oder anderswo verwenden.
Empfohlene / erforderliche Plugins
Nach der Installation und Aktivierung des Savoy Themes werden Sie über empfohlene Plugins informiert:
Manchmal benachrichtigt Ihr Design Sie über empfohlene Plug-ins, während andere Empfehlungen in deren Dokumentation enthalten. Es können Design-Design-Funktionen wie beispielsweise optionale Schieberegler verwendet werden, die nicht im Design enthalten sind, aber dafür angepasst sind.
Klicken Sie auf Plug-Ins installieren im Savoy-Design, um eine Liste der empfohlenen Plug-Ins anzuzeigen:
Auch dies wird von Thema zu Thema variieren, aber in diesem Fall möchten Sie vielleicht nicht alle installieren.
Zum Beispiel, während Savoy Contact Form 7 empfiehlt und Styling dafür enthält, möchten Sie dieses Plugin möglicherweise nicht für Ihr Kontaktformular verwenden. Vielleicht möchten Sie etwas wie Gravity Forms oder Ninja Forms verwenden.
Ein Plugin wie Regenerate Thumbnails ist ein exzellentes Plugin für diejenigen, die einen bestehenden Shop eingerichtet haben und ihre Bilder für ein vorheriges Theme konfiguriert haben. Dieses Plugin wird durch Ihre WordPress Media Library gehen und alle Ihre Bilder so skalieren, dass sie mit Ihrem neuen Thema funktionieren. Sie können dies mit den Dummy-Daten tun oder wollen, und Sie können dieses Plugin ganz überspringen (aber ich empfehle es trotzdem, so dass alle Medien für Testzwecke richtig dimensioniert sind).
Ein Plug-in wie das Envato Toolkit ist jedoch sehr wichtig für Themen, die über ThemeForest erworben wurden, um sicherzustellen, dass Sie über Theme-Updates informiert werden.
Ich würde empfehlen, alle empfohlenen Plugins zu installieren, wenn Sie anfangen. Sie können ein Plug-in jederzeit später entfernen, wenn Sie es nicht benötigen. Wenn Sie jedoch kein benötigtes Plugin installieren, können Sie frustriert sein, weil das Theme nicht "funktioniert" oder etwas tut, was Ihnen auf der Demo gefällt.
Wenn Sie alle, einige oder keine der empfohlenen und / oder erforderlichen Plugins installiert haben, vergessen Sie nicht, sie zu aktivieren:
Wenn Sie ein von ThemeForest erworbenes Theme verwenden, z. B. unser Beispielthema Savoy, vergessen Sie nicht, Ihren Marketplace-Benutzernamen und den geheimen API-Schlüssel im Envato WordPress Toolkit einzugeben, um sicherzustellen, dass die Themen aktualisiert werden.
Anpassen
Dies ist der Teil der Installation und Einrichtung Ihrer WordPress WooCommerce Thema, wenn es wirklich Spaß macht und Sie beginnen zu sehen, Ihre Website zum Leben erweckt.
Sie können den WordPress Customizer über das Menü in WordPress aufrufen: Darstellung > Anpassen. Oder gehen Sie zur Seite Designs unter Darstellung > Designs und klicken Sie dann auf die Schaltfläche Anpassen:
Willkommen beim WordPress Customizer:
Hier werden wir ein paar Optimierungen vornehmen, bevor wir in eine tiefere Konfiguration kommen.
Das erste, was Sie sehen werden, ist die Site-Identität. Hier können Sie Ihren Site Title und Tagline ändern.
Manchmal können Sie auch ein benutzerdefiniertes Header-Bild und / oder Site-Icon hinzufügen (dies variiert von Thema zu Thema).
Als nächstes konfigurieren Sie Ihre Menüs:
Wenn dies ein neues WooCommerce-Setup ist oder Sie noch keine Seiten erstellt haben, können Sie noch nicht viel "anpassen". Bei der Installation von WooCommerce wurden jedoch automatisch einige Seiten hinzugefügt, von denen Sie sicher sein möchten, dass sie sofort zu Ihrem Menü hinzugefügt werden.
Sie können einfach ein neues Menü hinzufügen und erstellen:
Sobald Sie ein Menü (oder mehrere) hinzugefügt haben, können Sie auswählen, wo das Menü angezeigt werden soll, sowie die verschiedenen Menüelemente (z. B. benutzerdefinierte Links, Posts, Seiten, Produkte usw.).
Dies gibt Ihnen viel Flexibilität bei der Funktionsweise Ihrer WooCommerce-Site. Haben Sie keine Angst, damit herumzuspielen oder es später zu ändern.
Bevor wir den WordPress Customizer verlassen, solltest du WordPress sagen, dass er die Titelseite zu deinem Store machen soll:
Mark Die Startseite wird als statische Seite angezeigt und Sie wählen die Startseite als Shop-Seite aus. Die Shop-Seite wurde automatisch erstellt, als Sie das WooCommerce-Plugin installiert haben.
Wie für die Posts-Seite hängt dies davon ab, ob Sie einen Blog auf Ihrer WooCommerce-Website haben möchten oder nicht. Wenn dies der Fall ist, müssen Sie eine Blog-Seite erstellen und diese auf der Seite des WordPress-Customizers oder in den WordPress-Admin-Einstellungen > Lesen auswählen.
Die Ergebnisse
Mit einer grundlegenden Konfiguration können Sie sehen, wie gut Ihr Online-Shop mit einem WordPress WooCommerce-Theme aussehen kann:
Die einzelnen Produktseiten sehen toll aus:
Es enthält sogar verwandte Produkte:
Das Savoy - Minimalistic AJAX WooCommerce Theme ermöglicht es Ihnen, viele Elemente auf Ihrer Site einfach zu optimieren und kann weit hinter alles zurückbleiben, was ich in diesem Tutorial behandelt habe (lesen Sie die Dokumentation Ihres Themas, um mehr über Ihr Thema zu erfahren). Ich habe Ihnen nur Änderungen gezeigt, die im WordPress-Customizer vorgenommen werden können und normalerweise für fast jedes Thema verwendet werden können.
Fazit
Sie können deutlich sehen, wie einfach diese anfänglichen ersten Schritte bei der Konfiguration Ihres neuen WordPress WooCommerce-Designs sein können und wie gut es aussieht - einfach durch Verwendung eines speziell für WooCommerce entwickelten WordPress-Themes.
Es gibt viele nützliche WordPress WooCommerce Plugins auf CodeCanyon und einige wunderschön gestaltete und effektive WordPress WooCommerce Themes auf ThemeForest.
Ein Blick auf einige der meistverkauften ThemeForest WooCommerce-Themen könnte ein guter Anfang sein (Savoy ist immer noch mein Favorit). Ich bin sicher, dass Sie etwas finden, das perfekt zu Ihrem E-Commerce-Shop passt. Oder stöbern Sie in unserem vorgestellten Showcase, um genau das Richtige für Ihr Geschäft zu finden:
Wozu benutzt du WooCommerce?
