Neue Ecwid-Designeinstellungen: Dutzende Anpassungsoptionen, keine Codierung erforderlich

12 min gelesen

Design spricht Bände für ein e-commerce Shop. Wenn die Leute sich problemlos in Ihrem Online-Shop zurechtfinden, haben Sie eine viel bessere Chance, sie zu konvertieren. Ein einheitliches, modernes Design kann Kunden zeigen, dass Sie eine vertrauenswürdige Marke sind.

Ecwid hilft jedem Unternehmen – auch einem kleinen und beginnenden –, im Internet professionell auszusehen und zu verkaufen. Sie müssen nicht viel bezahlen, um Spitzengruppe Web-Designer, um eine mobilfreundlich, sauber und schön e-commerce zu speichern.

Wir haben hinzugefügt Dutzende neuer Storefront-Design-Funktionalitäten zu Ecwid, damit Sie Ihre e-commerce Speichern Sie das Erscheinungsbild, das Ihre Marke am besten widerspiegelt.

Das Einrichten jedes kleinen Details in Ihrem Online-Shop-Design ist kinderleicht. Ändern Sie Bildstile, Produktseitenlayouts und Storefront-Elemente ohne Codierung. In diesem Beitrag werden Sie es selbst sehen.

Die neuen Einstellungen verschachteln sich unter Einstellungen → Design in Ihrem Ecwid-Kontrollbereich. Um sie zu verwenden, stellen Sie sicher, dass Sie alle Storefront-Updates in Einstellungen → Was ist neu.

Abschnitt „Was ist neu“ im Ecwid-Kontrollfeld

Aktivieren Sie diese Updates unter Einstellungen → Was ist neu, um die neue Seite mit den Designeinstellungen anzuzeigen.

Was ist, wenn ich die ältere Version des Ecwid-Storefronts verwende?

Der Wechsel zur neuen Storefront kann das Aussehen Ihres Shops komplett verändern. Mit den neuen Designeinstellungen erhalten Sie mehr Anpassungsmöglichkeiten und ein ansprechenderes Aussehen für Ihren Shop. Seien Sie jedoch vorsichtig, wenn Sie ein selbst gemacht CSS-Theme oder andere kundenspezifische Storefront-Funktionen – diese sind möglicherweise nicht mit der neuen Storefront kompatibel. Wenn Sie Hilfe benötigen, ist unser Support-Team für Sie da.

Gestalten Sie Ihren Online-Shop

Sie kontrollieren das gesamte Erscheinungsbild Ihres Produktkatalogs, von Produktbildern bis hin zu Artikelnummern und Schaltflächen.

1. Wählen Sie die beste Bildgröße, um Ihre Produkte zu präsentieren

Standardmäßig sind Produktbilder mittelgroße, das für die meisten Geschäfte geeignet ist.

Einige Produkte weisen wichtige Details auf, die Sie möglicherweise visualisieren möchten (beispielsweise, wenn Sie Schmuck oder Gemälde verkaufen). Wählen Sie die große Bildgröße, damit Ihre Kunden Ihre schönen Produkte und Fotos bewundern können.

Wenn Sie einen Produkttyp in einem großen Sortiment verkaufen (sagen wir 200 Ledergürtel in verschiedenen Farben), sollten Sie sich an kleinere Bilder halten. Ihr Geschäft zeigt viele Produkte auf dem Bildschirm und Ihre Kunden werden von der Auswahl beeindruckt sein.

Kleine, mittlere und große Bildgröße für Produktbilder

2. Optimieren Sie das Bildseitenverhältnis entsprechend den Abmessungen Ihres Produkts

Verkaufen Sie Palmen? Oder vielleicht langbeinig Modelle präsentieren Ihre Designermäntel? Beides wird auf vertikalen Bildern großartig aussehen.

Das horizontale Verhältnis eignet sich für breite Produkte, beispielsweise Schuhe, Sofas oder Nährstoffriegel.

Verwenden Sie für runde Objekte (oder im Zweifelsfall) quadratische Bilder, diese sehen immer gut aus.

Vertikale, horizontale und quadratische Produktbilder

Vertikale, horizontale und quadratische Bilder

Wenn Sie Produktbilder hervorheben und vom Shop-Hintergrund abheben möchten, wählen Sie „Bildhintergrund abdunkeln“.

3. Wählen Sie aus, welche Produktinformationen im Schaufenster angezeigt werden sollen

Ähnlich wie bei Produktfotos können Sie auch für andere Storefront-Elemente aus zahlreichen Designoptionen wählen: Produktnamen, Titel, Preise, SKUs, „Kaufen“-Buttons. Entscheiden Sie, wie jedes davon angezeigt werden soll – unter dem Produktbild oder beim Mouseover.

Elemente unter Produktbildern, beim Hovern oder Ausblenden anzeigen

Wenn Sie die Informationen unter den Produktbildern platzieren möchten, können Sie das Layout festlegen. Richten Sie Ihren Inhalt linksbündig, rechtsbündig, zentriert oder im Blocksatz aus. - Sie können den Look kreieren, der Ihnen am besten gefällt.

Verschiedene Layouts der Elemente (Produktname und Preis) Verschiedene Layouts der Elemente

Unterschiedliche Anordnung der Elemente (Produktname und Preis)

Es ist auch möglich, Elemente auszublenden. Blenden Sie alle aus, damit Ihr Schaufenster wie ein Lookbook aussieht. Wenn Ihre Kunden auf eines der Produktbilder klicken, gelangen sie auf die Produktseite.

Wählen Sie die Anzeige eines zusätzlichen Produktbilds, wenn Sie weitere Details anzeigen möchten. Ecwid zeigt das erste Bild aus der Produktfotogalerie an, wenn Sie mit der Maus darüber fahren.

Zusätzliches Produktbild bei Mouse-Hover

Durch die neuen Einstellmöglichkeiten ergeben sich zahlreiche Gestaltungsmöglichkeiten für die Optik Ihres Schaufensters.

4. Gestalten Sie Ihre Shop-Kategorien

Sie finden Optionen zum Einrichten des Aussehens Ihrer Kategorien. Egal, ob Sie Fotos, Symbole oder Markenlogos für Ihre Kategoriebilder haben, Ecwid bietet Designoptionen, um ihnen ein atemberaubendes Aussehen zu verleihen.

Kategorienamen unter Bildern, auf Bildern, beim Hovern und ausgeblendet

Optimieren Sie Produktseiten für die Konvertierung

Jetzt können Sie die Informationen Ihrer Produktseiten auf unterschiedliche Weise organisieren, je nachdem, was für Ihre Kunden am besten funktioniert. Jede Designoption wird nach den besten e-commerce Praktiken zur Steigerung der Konvertierungen.

1. Wählen Sie das Produktseitenlayout

Es gibt vier neue Optionen zum Organisieren von Inhalten auf Ihren Produktseiten.

Machen Sie mit Ihren Produktbildern auf sich aufmerksam. Platzieren a hochwertige Das Produktbild auf der linken Seite Ihrer Produktseite ist das erste, was Ihre Kunden bemerken werden. Verwenden Sie das 2-spaltig Layout mit der Produktbeschreibung auf der rechten Seite, wenn Sie optisch ansprechende Produkte verkaufen und kurze Produktbeschreibungen haben.

Die 2-spaltig Layout mit der Produktbeschreibung auf der rechten Seite

Fügen Sie detaillierte Produktbeschreibungen hinzu. Bei Produkten wie Elektronik oder Pharmazeutika können Produktbeschreibungen ziemlich lang sein. Wählen Sie dann die zweispaltig Layout mit der Produktbeschreibung unter dem Bild. Selbst wenn Sie eine lange Gebrauchsanweisung für Ihr Produkt hinzufügen, sieht die Seite harmonisch aus.

Die 2-spaltig Layout mit der Produktbeschreibung unter dem Bild

Heben Sie die Produktoptionen und die Schaltfläche „Zur Kasse“ hervor. Wenn Ihre Kunden keine langen Beschreibungen lesen oder die Galerie genau durchsehen müssen, um Ihre Produkte zu kaufen, können Sie die Produktoptionen mit der Schaltfläche „Zur Kasse gehen“ auf der linken Seite anzeigen. Angenommen, Sie verkaufen kleine Aquarienfische.

Der „Zur Tasche hinzufügen“-Button im Fokus

Minimieren Sie Scrollen und Ablenkung. A dreispaltig Layout funktioniert, wenn Sie auf Ihrer Produktseite möglichst viele Informationen ohne zusätzliche Umwege anzeigen möchten.

die kompakte 3-spaltig Layout

Sie können uns auch Wählen Sie das Layout Ihrer Fotogalerie. Helfen Sie Ihren Kunden, mit einer überzeugenden Fotogalerie ein Gefühl für Ihr Produkt zu bekommen. Wählen Sie das Layout für Miniaturansichten der Bilder in Ihrer Galerie (vertikal oder horizontal) oder zeigen Sie Ihre faszinierenden Bilder in voller Größe. Je mehr abwechselnde und detailliertere Ansichten Sie zeigen, desto besser.

Layoutoptionen für die Fotogalerie

3. Wählen Sie die Produktinformationen aus, die in der Seitenleiste angezeigt werden sollen

Eine konvertierende Produktseite bietet ausreichend Produktinformationen und ist dennoch einfach gehalten. In Ecwid können Sie die Elemente (wie SKU, Produktoptionen, Teilen-Schaltflächen) ausblenden, wenn Sie sie nicht benötigen, damit Ihre Kunden auf dem Weg zum Warenkorb nicht abgelenkt werden.

Das Beste daran ist, dass Sie jedes Element ziehen und in beliebiger Reihenfolge anordnen können. Testen Sie viele neue Möglichkeiten, um Ihre Produktseiten für Conversions zu optimieren.

Flexible Seitenleisteneinstellungen

Ändern Sie die Navigation und Farben Ihrer Storefront

Es gibt noch einige weitere Storefront-Einstellungen, die standardmäßig aktiviert sind, um Ihren Kunden die Navigation in Ihrem Shop zu erleichtern. Sie können diese Einstellungen jederzeit deaktivieren.

Wenn Sie von der älteren Storefront-Version wechseln, werden diese Einstellungen in der Originalversion in die neue Storefront migriert.

Farbadaptiver Modus. Wenn Sie einen Ecwid-Onlineshop auf Ihrer Website installieren, werden die Shopfarben automatisch an das Design Ihrer Website angepasst. Ihr Shop sieht dann wie ein natürlicher Teil Ihrer Website aus.

Das Fußzeilenmenü und die Breadcrumbs Helfen Sie Kunden, sich in Ihrem Geschäft schneller zurechtzufinden und verhindern Sie, dass sie sich verirren.

Die Sign-in Link ermöglicht es Kunden, sich bei ihrem Profil anzumelden, um ihre Bestellungen anzuzeigen und die Wunschliste zu verwenden.

„Sortieren nach“-Optionen Ermöglichen Sie Ihren Kunden, Ihre Produkte nach Preis, Name und anderen Bedingungen zu sortieren.

Andere Möglichkeiten, das Design Ihres Ecwid-Shops zu ändern

Die neuen Designeinstellungen decken die häufigsten Anwendungsfälle ab. Wenn Sie Ihren Shop auf andere Weise verändern möchten:

Wenn Sie ein benutzerdefiniertes Design für Ihren Shop ohne Codierung benötigen, versuchen Sie Entwerfen Sie Apps aus dem Ecwid App Market (verfügbar in kostenpflichtigen Ecwid-Plänen, es gelten App-Preise).
Erstellen Sie ein benutzerdefiniertes CSS-Design (ein Satz von Regeln, der das Aussehen jedes Elements im Shop bestimmt, wie Größe, Form oder Farbe). Das Erstellen eines CSS-Designs erfordert bestimmte technische Kenntnisse. Es gibt eine Leitfaden zu CSS-Themen in der Ecwid Knowledge Base das erklärt, wie Sie Ihr eigenes CSS-Theme erstellen und Anweisungen zum Ändern bestimmter Elemente. Sie können jederzeit das Ecwid-Kundenbetreuungsteam um Hilfe bitten oder Bestellen Sie die individuelle Entwicklung Ihres eigenen CSS-Themas.
Für Entwickler: Verwenden Sie die Ecwid Javascript API um die Funktionen des Ecwid-Storefronts zu erweitern. Sie können ein neues CSS-Design oder eine App erstellen und diese auf dem Ecwid-App-Markt verkaufen. Mit der Ecwid-Javascript-API können Sie das Erscheinungsbild des Storefronts vollständig ändern und so viele Änderungen vornehmen, wie Sie möchten. Wenn Sie bereit sind, loszulegen, klicken Sie bitte hier. Registrieren Sie sich auf unserer Seite für Entwickler.

Holen Sie sich eine kostenlose Website für Ihren Online-Shop

Ihr Ecwid-Shop sieht toll aus, aber Sie haben keine Website zum Verkaufen?

Instant Site ist ein kostenloser Website-Builder, den Ecwid Ihnen bei der Erstellung Ihres Ecwid-Kontos zur Verfügung stellt. Damit können Sie schnell mit dem Online-Verkauf auf einer übersichtlichen Webseite beginnen und sofort Gewinne erzielen, um Ihr Geschäft auszubauen.

Apropos Design: Instant Site wurde erstellt mit fertig Blöcke (Titelbild, Logo, Online-Shop, Abschnitt „Über uns“, Kundenfeedback und Kontakte), die Sie aktivieren, deaktivieren und anpassen können.

Wen rufen Sie an, wenn Sie Ihre Instant Site anpassen müssen? Niemanden! Sie können die gesamte Website ohne Spezialkenntnisse bearbeiten, indem Sie Ihren Desktop-Computer verwenden oder sogar die Ecwid Mobile Store Management-App für iOS.

Erstellen Sie noch heute Ihre kostenlose Instant Site mit unseren Schritt für Schritt Guide.