Einen Ecwid-Shop über den Website Editor einrichten

In diesem Artikel zeigen wir dir, wie du einen Ecwid Shop erstellen und in deine Website integrieren kannst. 


Einführung

Sitejet bietet dir eine integrierte Shop-Lösung in Zusammenarbeit mit Ecwid, welche dir eine simple und schnell Möglichkeit bietet, einen Webshop in deiner Website zu integrieren. Mit der Einbindung kannst du dann den Shop über den Website-Editor und das leistungsstarke Backend von Ecwid ganz einfach verwalten und einrichten. Es dauert nur wenige Minuten bis du einen Shop erstellt und individualisiert in deine Seite eingebunden hast. Der Shop kann kostenlos für bis zu fünf Produkte auf einmal genutzt werden. Solltest du mehr Produkte managen wollen, ist ein Upgrade auf ein bezahltes Paket notwendig. In unserem Beispiel gehen wir davon aus, dass ein Modeladen einen Shop auf seiner Website einbinden möchte. 

Wenn du schon einen bestehenden Shop bei Ecwid oder einem anderen Anbieter hast, so ist es möglich, diesen auf deiner Website einzubinden. Weitere Informationen findest du in unserem Artikel "Einen Shop zu deiner Website hinzufügen". Die Integration in den Website-Editor ist allerdings nicht möglich. 


Einen Shop erstellen

Im linken Contentpanel findest du die Kategorie "Shop". Wenn du diese anklickst, siehst du die Möglichkeit, einen neuen Shop mit Ecwid zu erstellen. Dafür musst du eine E-Mail-Adresse hinterlegen und auf "Shop erstellen" klicken. Wir empfehlen hier deine Mail zu benutzen, die du auch für diese Website festgelegt hast. 

Eröffnest du einen Shop für deine Kunden, empfehlen wir hier die E-Mail-Adresse deines Kunden zu hinterlegen, da sie wahrscheinlich auch den Shop managen werden. 

Wenn du auf "Shop erstellen" klickst, stimmst du den AGB und der Datenschutzerklärung der Ecwid, Inc. zu. 


Den Shop in die Website integrieren

Sobald du einen Shop erstellt hast, findest du unter der Kategorie "Shop" die folgenden vier Shop-Elemente: 

Produkte: Damit wird das Hauptlayout der Produkt-Übersicht in die Website eingebettet. Anpassungen zu diesem Layout können bei Ecwid unter Konfiguration > Gestaltung angepasst werden. 
Warenkorb: Wenn du den Warenkorb hinzufügst, erscheint ein Taschen-Icon, dass dem User Zugriff auf den Warenkorb gibt. Dieser ist meistens im Produkte-Elemente enthalten. 
Suchen: Mit dem Suchfeld kann schnell nach einem bestimmten Produkt gesucht werden. 
Kategorien: Hiermit erscheint ein Auswahlfeld, um bestimmte Kategorien auszuwählen. Um dieses Element nutzen zu können, müssen zunächst Kategorien in Ecwid unter Produkte > Kategorien angelegt werden. 

Um das Produkte-Element ansprechend in deine Website zu integrieren, füge zunächst einen Container hinzu. Öffne dafür die Kategorie "Elemente" in der linken Sidebar und Drag-and-drop das Container-Element an die gewünschte Stelle. Du kannst die gewohnten Container-Einstellungen wie "Abstand" nutzen, um bspw. etwas Platz zwischen den Produkten und dem Rand der Website zu schaffen. Gehe dann zur "Shop" Kategorie und ziehe dann das Produkte-Element in den Container. Es sollte dann ungefähr so aussehen, wie im oberen Bild. 

Als Erstes wird eine Beispiel-Ansicht mit Beispiel-Produkten geladen. Diese kannst du in deinem Ecwid Control Panel löschen. Um auf Ecwid zuzugreifen, klicke auf den Button "Shop Control Panel öffnen" im linken Settings Panel des Produkte-Elements. Klicke dann auf Produkte, um neue Produkte hinzuzufügen und alle Beispiel-Produkte über einen Button zu löschen.


Produkte hinzufügen

Unter Shop-Verwaltung > Produkte kannst du deine Produkte managen. Wenn du ein Produkt löschen möchtest, klicke auf den Pfeil neben "Produkt bearbeiten". Wenn du mehrere Produkte auf einmal löschen möchtest kannst du die Checkboxen nutzen und über die "Massenaktualisierung" die gewünschten Änderungen vornehmen. 

Um ein neues Produkt hinzuzufügen, klicke auf "+ neues Produkt". 

Das öffnet eine Eingabemaske, die es dir erlaubt, alle wichtige Informationen über das Produkt zu ergänzen, bspw. Bilder hochladen, einen Namen und eine Beschreibung zu hinterlegen, einen Preis und eine Artikelnummer festsetzen und das Gewicht zu ergänzen (wichtig, wenn der Artikel versendet wird). Wenn du alle notwendigen Informationen hinterlegt hast, klicke Speichern. Wenn du mehrere ähnliche Produkte hast, kannst du auch die "Duplizieren"-Funktion nutzen, um schneller neue Produkte hinzuzufügen. 


Shop-Regionen

Als Nächstes möchtest du wahrscheinlich regionale Einstellungen vornehmen, wie die Währung, Gewicht- und Größeneinheiten, Uhrzeit- und Datumsformate und die Shop-Sprache. Klicke dafür auf Einstellungen > Allgemein > Formate & Maßeinheiten unter dem Punkt Konfiguration. 

Die Shop-Sprache wird standardmäßig in der lokalen Sprache des Shopbesuchers ausgegeben, auf Grundlage der Browser-Informationen. Abgesehen von deinen individuellen Produkttexten wird alles in die erkannten Sprache übersetzt. Du kannst auswählen, welche Sprache die Standardsprache ist. Wenn du weitere Sprache auswählen möchtest, ist ein Upgrade zu einem bezahlten Paket notwendig. 


Zahlungsmethoden hinzufügen

Unter Konfiguration > Zahlung kannst du auswählen, welche Zahlungsmethoden den Shop-Besuchern angeboten werden. 


Versandoptionen auswählen

Unter "Versand & Abholung" kann hinterlegt werden, auf welche Arten die Produkte zu den Shop-Kunden geliefert werden. Bspw. kann es sein, dass nur lokal geliefert wird und/oder Abholung ausgeschlossen ist. Bei Versand wird sehr wahrscheinlich der Endpreis beeinflusst. 

Die Einstellungen können jederzeit geändert werden. Wenn die Shop-Besucher während Anpassungen keinen Zugriff auf den Shop haben sollen, kann er auf einen Wartungszustand gesetzt werden. Gehe dafür einfach auf Einstellungen > Allgemein und scrolle bei Shop-Profil runter bis du "Shop geöffnet" siehst und klicke dann auf den Button um den "Shop für Wartungsarbeiten schließen". 


Suchfeld hinzufügen

Wenn du einen Shop mit mehreren Produkten und Kategorien einbindest, kann es nützlich sein, dem Website-Besucher ein Suchfeld anzubieten, um nach bestimmten Produkten zu suchen. Dafür findest du das Element "Suchen" unter der Kategorie "Shop" in der linken Sidebar. Dieses kannst du ganz einfach per Drag-and-drop über oder unter deinem Shop platzieren. Das Suchfeld ist standardmäßig linksbündig, kann aber ganz einfach über die Zuordnung der Klasse "center" im Einstellungen-Panel unter Style > ID & Klassen zentriert werden.  


Style deinen Shop

Unter Design > Shop kannst du unterschiedliche Eigenschaften des Shops weiter individualisieren und an den Style der Website anpassen. Hier kannst du Farben, Schrifteinstellungen, Links, Rahmen und vieles mehr für alle Elemente deines Shops anpassen.


Deinen Ecwid-Shop whitelisten

Wenn du Sitejets Cookie Consent Bar nutze, welche alle Java Scripte von Drittanbieter automatisch blockt, bis der Website-Besucher seine Einwilligung zum Setzen von Cookies und Tracking gibt, kannst du den Ecwid Shop mit dem folgenden Code -Snippet whitelisten: 

<script>(function(w,a,i){w[a]=w[a]||[];w[a].push(i)})(window,'YETT_WHITELIST',/ecwid|storefront|ecomm|new-frontend/)</script>

Weitere Hilfe

Jetzt weißt du, wie du einen einfachen Shop mit der Ecwid-Integration erstellen kannst. Weitere Informationen und detaillierte Hilfestellungen zu den unterschiedlichen Funktionen von Ecwid findest du in Ecwids Hilfecenter


Werde ein Teil unserer Community!

Tausche dich mit anderen Webdesignern über aktuelle Entwicklungen, Tipps und Tricks aus und präsentiere deine Lieblingsseiten. Hole dir Feedback und sprich mit uns über Funktionen, die du dir für Sitejet wünschst. Hier gelangst du direkt zur Sitejetters Community.

Zurück zum Anfang

Hilfe benötigt? Kontakt aufnehmen Kontakt aufnehmen