Innerhalb dieses Leitfadens werden wir sehen, wie man eine E-Commerce-Website mit Framework360 erstellen kann.
Zunächst ist es wichtig zu unterscheiden, ob wir eine E-Commerce-Website mit einem einzelnen Produkt oder mit mehreren Produkten erstellen möchten. Im ersten Fall, wenn wir ein einzelnes Produkt verkaufen möchten, reicht es aus, im Hauptmenü von Framework360 auf die Option Checkout zu gehen, den Checkout einzurichten und unser Produkt manuell einzufügen; darum haben wir uns in einem speziellen Leitfaden gekümmert, den du hier klicken kannst.
In diesem Leitfaden werden wir uns hingegen damit beschäftigen, wie man eine E-Commerce-Website für den Verkauf mehrerer Produkte erstellt.
Schritt 1: Installieren wir das Plugin Ecommerce
Zuerst müssen wir das Plugin Ecommerce installieren, um dies zu tun, gehen wir zur Option Plugin des Hauptmenüs von Framework360, indem wir die folgenden Schritte ausführen:
Anpassung > Plugin
Sobald wir im Plugin-Bereich sind, suchen wir über das entsprechende Suchfeld nach dem Plugin Ecommerce und installieren es.
Nach der Installation des Plugins wird im Hauptmenü von Framework360 ein neuer Abschnitt namens Ecommerce geöffnet, über den wir unsere Webseite mit allen Multi-Produkt-Funktionen erweitern können.
Schritt 2: Stellen Sie die Einstellungen für das Plugin Ecommerce ein
Nachdem wir das Plugin Ecommerce installiert haben, müssen wir zum Abschnitt Plugin-Einstellungen im Hauptmenü von Framework360 und gehen Sie zu dem Punkt Einstellungen Ecommerce, indem Sie die folgenden Schritte ausführen:
Personalisierung > Plugin-Einstellungen > Ecommerce
Sobald Sie auf der Seite zur Personalisierung der Ecommerce Einstellungen sind, können wir über den Punkt Bewertungssystem entscheiden, ob wir die Möglichkeit aktivieren möchten, dass unsere Kunden Bewertungen hinterlassen.
Schließlich können wir über die Stimme Automatische Lageraktualisierung entscheiden, ob das Lager die Menge der verkauften Artikel automatisch reduzieren soll, wenn der Kunde die Bestellung aufgibt oder wenn die Bestellung als bezahlt gilt.
Schritt 3: Fügen wir ein Produkt zu unserem E-Commerce hinzu
Um ein Produkt zu unserem E-Commerce hinzuzufügen, gehen wir im Hauptmenü von Framework360 zu Produkte und folgen den folgenden Schritten:
Ecommerce > Produkte
Sobald wir im Bildschirm Produkte sind, klicken wir auf die grüne Schaltfläche oben rechts Hinzufügen.
Im Bildschirm zur Erstellung des Produkts haben wir verschiedene Tabs, die es uns ermöglichen, die Erstellung unseres Produkts genau zu personalisieren.
TAB PRODUKT
Im Tab Produkt können wir hinzufügen:
- den Namen des Produkts;
- die entsprechende Kategorie (gleich werden wir uns auch mit der Erstellung der Kategorie beschäftigen);
- den Preis;
- die eventuell anzuwendende Steuer auf den Preis;
- Ein möglicher Rabatt des Artikels und die zeitliche Begrenzung des Rabatts;
- die Lagerbestände des Produkts;
- die Mindestmenge des kaufbaren Produkts (nützlich für Websites, die sich mit dem Großhandel beschäftigen);
- die kurze Beschreibung und die ausführliche Beschreibung des Produkts;
- entscheiden, ob das Produkt hervorgehoben werden soll;
- die Produktart (Standard, digital oder Geschenkgutschein);
- der Produktcode;
- die EAN;
- das Gewicht des Produkts.
TAB ATTRIBUTEN UND VARIANTEN
während wir uns im Tab Attribute und Varianten bewegen, können wir die möglichen Attribute des Produkts auswählen, wenn das Produkt Variationen aufweist, zum Beispiel in Größe oder Farbe.
Um Attribute zu unserem Produkt hinzuzufügen, ist es notwendig, dass diese Attribute im Voraus im entsprechenden Bereich des Hauptmenüs von Framework360 erstellt wurden, der Attribute genannt wird. Um den Bereich Attribute zu erreichen, müssen wir zum Hauptmenü von Framework260 gehen und die folgenden Schritte ausführen:
Ecommerce > Attribute
Sobald wir uns im Bereich Attribute befinden, können wir durch Klicken auf die grüne Schaltfläche oben rechts Hinzufügen ein neues Attribut hinzufügen. An diesem Punkt öffnet sich der Bildschirm zur Erstellung des Attributs, in dem wir die gewünschte Variation erstellen und definieren können.
Nachdem wir unser Attribut erstellt haben, können wir zum Tab Attribute und Variationen, der sich im Bildschirm zur Erstellung des Produkts befindet, zu dem wir zuvor waren, zurückkehren und das erstellte Attribut auswählen. Im nächsten Bild sehen wir ein Beispiel, bei dem wir das Farb-Attribut unseres Produkts auswählen:
Sobald das gewünschte Attribut ausgewählt ist, können wir im Tab Attribute und Variationen weiter scrollen und ein Bild, den Code, die Menge und den Preis jeder Variante unseres Attributs eingeben. Im dargestellten Beispiel haben wir die Möglichkeit, das Bild des Produkts in Rot, das Bild des Produkts in Grün sowie die entsprechenden Codes, Mengen und Preise einzufügen, falls sich letztere von dem im vorherigen Tab Produkt eingegebenen unterscheiden.
TAB VERBUNDENE ARTIKEL
Innerhalb des Tabs Verbundene Artikel haben wir die Möglichkeit, eventuell verbundene Artikel einzufügen in:
- Up-Sell, das heißt, ein Upgrade des Produkts einzufügen (zum Beispiel, wenn das betreffende Produkt ein Schuhmodell ist, könnte das Up-Sell ein ähnliches, aber teureres Schuhmodell sein), es wird dem Kunden vorgeschlagen, das Upgrade anstelle des Produkts zu kaufen, das er gerade ansieht;
- Cross-Sell, das heißt, ein verwandtes Produkt zu dem hinzuzufügen, was der Kunde gerade ansieht (zum Beispiel, wenn das betreffende Produkt ein Schuhmodell ist, könnte das Cross-Sell ein Paar Socken sein), es wird dem Kunden die Kombination aus dem Kauf beider Produkte vorgeschlagen.
TAB BILDER
Im Tab Bilder haben wir die Möglichkeit, verschiedene Bilder des Produkts hochzuladen. Wir erinnern daran, dass wir, um unterschiedliche Bilder basierend auf einem bestimmten Attribut einzufügen, wie zuvor gesehen, zum Tab Attribute und Variationen gehen sollten.
TAB SEO
Im Tab SEO haben wir die Möglichkeit, einen TAG Title und eine TAG Description einzufügen, um zu entscheiden, wie das Produkt in der Suchmaschine erscheinen wird.
TAB SOCIAL
Schließlich können wir im Tab Social entscheiden, wie unser Produkt in den sozialen Medien erscheinen wird, also dasselbe Prinzip, das wir für den Tab zur SEO gesehen haben, aber für die sozialen Netzwerke.
Schritt 3: Lass uns die Kategorien und Unterkategorien unserer Produkte erstellen
Wie man die Kategorien und Unterkategorien unserer Produkte erstellt, haben wir einen speziellen Artikel verfasst, den ich dir empfehle zu konsultieren indem du hier klickst.
Schritt 4: Fügen wir die Produkte auf der Website hinzu, um sie kaufbar zu machen
Sobald die Produkte erstellt sind, bleibt uns nichts anderes übrig, als sie auf der Website einzufügen, um sie kaufbar zu machen.
Zuerst müssen wir zur Seite der Website gehen, innerhalb derer wir unsere Produkte anzeigen lassen wollen, was zum Beispiel die Startseite der Website sein könnte. Um dies zu tun, gehen wir zum Punkt Seiten im Hauptmenü von Framework360 und folgen diesen Schritten:
Website > Seiten
Sobald wir uns im Überblicksbildschirm aller Seiten der Website befinden, klicken wir auf die Seite, auf der wir unsere Produkte einfügen möchten, um sie zu bearbeiten.
Gut, an diesem Punkt befinden wir uns im Bearbeitungsbildschirm der von uns ausgewählten Seite. Lassen Sie uns nun eine Zeile hinzufügen und über den Visual Builder von Framework360 das Produktliste-Block (verfügbar im Tab Ecommerce) in die Zeile einfügen, wie in den folgenden Abbildungen gezeigt:
An diesem Punkt wird Framework360 uns sagen, dass es notwendig ist, eine Struktur des Blocks zu erstellen. Gehen Sie dazu zum Tab Struktur, um eine neue Struktur zu erstellen oder eine zuvor erstellte Struktur zu importieren, wie in der nächsten Abbildung gezeigt:
Sobald wir unsere Struktur definiert haben, wenn wir die Anzeige ändern möchten (zum Beispiel, festlegen, ob die Produkte in einem Raster oder in einem Karussell angezeigt werden sollen und wie viele Produkte im Raster oder Karussell in den verschiedenen Positionen Mobiltelefon, Tablet und PC angezeigt werden sollen), sollten wir zum Tab Allgemein unter dem Punkt Anzeige.
Schritt 5: Wir bearbeiten die Produktseite
Sobald das Produkt Framework360 erstellt wurde, wird automatisch die Seite erstellt, auf der das Produkt angezeigt wird. Wenn wir diese Seite ändern möchten, müssen wir nur den Punkt Seiten im Hauptmenü von Framework360 aufrufen und die folgenden Schritte ausführen:
Website > Seiten
Sobald wir im Punkt Seiten sind, suchen wir die Seite unseres Produkts und können sie durch Klicken darauf über den Visual Builder von Framework360 bearbeiten.
Oder, wenn wir die Grafiken unserer Produktseiten nicht manuell ändern möchten, könnten wir eines der vielen für E-Commerce vorgesehenen Templates installieren, die Framework360 uns zur Verfügung stellt. Um das Template zu ändern, müssen wir zum Punkt Themes im Hauptmenü von Framework360 gehen und die folgenden Schritte ausführen:
Personalisierung > Themen
Schritt 6: Fügen wir den Warenkorb in das Hauptmenü ein
Jetzt schauen wir uns an, wie wir den Warenkorb im Menü unserer Website, also im Header der Seite, hinzufügen können. Dazu gehen wir zu dem Punkt Globale Blöcke im Hauptmenü von Framework360 und folgen diesen Schritten:
Website > Globale Blöcke
Sobald wir im Bildschirm der Globalen Blöcke sind, klicken wir auf den Block Hauptmenü , um ihn zu bearbeiten. An diesem Punkt fügen wir eine neue Spalte in unser Menü ein und bewegen uns darin, durch den Visual Builder von Framework360, zum Block Warenkorb , wie in der folgenden Abbildung gezeigt. Den Warenkorb-Block finden wir im Tab Zahlungen des Visual Builders.
Nachdem wir den Block Warenkorb eingefügt haben, passen wir ihn nach unseren Wünschen an, immer über den Visual Builder, und das Spiel è fatto!
Wenn du entdecken möchtest, wie du das Header deiner Website mit Framework360 erstellen kannst, haben wir einen speziellen Leitfaden erstellt, den du hier klicken kannst.
Schritt 7: Wir richten den Checkout ein
Es ist an der Zeit, den Checkout einzurichten. Ein Checkout ist der letzte Teil einer E-Commerce-Website, der es dem Kunden ermöglicht, die Produkte zu kaufen, die er zuvor in den Warenkorb gelegt hat oder die er auf jeden Fall kaufen möchte.
Wie man den Checkout korrekt einrichtet, haben wir einen speziellen Leitfaden erstellt, den ich dir empfehle zu konsultieren hier klicken.
Schritt 8: Wir verbinden die Zahlungsmethoden PayPal und Stripe
Gut, wir sind beim letzten Schritt des Kaufprozesses angekommen, nämlich bei der Zahlung. Um dem Kunden die Zahlung zu ermöglichen, müssen wir unserem E-Commerce-Website eine Zahlungsmethode hinzufügen; die am häufigsten verwendeten Methoden sind PayPal und Stripe. Wir haben zwei spezielle Anleitungen erstellt, in denen wir erklären, wie man diese beiden Zahlungsmethoden mit Framework360 verbindet. Um sie zu konsultieren, klicke auf die folgenden Links:
- Wie man PayPal mit unserer Website, die auf Framework360 erstellt wurde, verbindet
- Wie man Stripe mit unserer Website, die auf Framework360 erstellt wurde, verbindet
Schritt 9: Erstellen wir einen Rabattcoupon
Zuletzt ist es wichtig zu erwähnen, dass Framework360 uns auch die Möglichkeit gibt, einen Rabattcoupon zu erstellen, den die Kunden beim Kauf in unserem E-Commerce nutzen können. Auch zu diesem Thema haben wir zur besseren Klarheit eine spezielle Anleitung erstellt, die du hier klicken kannst.