Profi-Tipps für individuelles Design
Shopando ist so konzipiert, dass auch Anfänger ihren Shop oder ihre Website mit nur einem Klick voll-funktionsfähig startbereit erhalten. Mit Shopando arbeiten aber Profis aus der Design- und Marketing-Szene, die den robusten und rechtssicheren Systemaufbau als professionelle Basis benötigen. Dabei steht meist individuelles Design und Styling für anspruchsvolle Kundenprojekte im Vordergrund. Hier möchten wir allen Design-Profis den schnellen Zugang zu den mächtigen und gleichzeitig sehr einfachen, individuellen Gestaltungsmöglichkeiten zeigen.
The accessible Shopando website was also created with the Shopando website editor!
Wähle die neutrale Vorlage "Blank"
Wenn du eine klare, individuelle Vorstellung von deinem Design-Konzept hast, die von allen Premium-Vorlagen weitgehend abweicht, empfiehlt es sich, die neutral und schlank gestaltete Design-Vorlage "Blank" zu wählen.
Es sind in dieser Vorlage nur wenige Seiten mit sehr reduzierten, klassisch gehaltenen Stilen und minimalen Platzhalter-Inhalten ausgestaltet. Du musst also kaum Demo-Inhalte oder markante Stilelemente neutralisieren.
Schriften ändern und sparsam einsetzen
Als Nächstes definiere die passenden Schriften des Corporate Designs. Dafür ändere im Design-Editor die in der Vorlage verwendeten Schriften. Du kannst natürlich auch eigene Schriftfamilien raufladen, damit sie dir für den Einsatz bei allen Elementen zur Verfügung stehen.
Wichtig: Halte die Anzahl der verwendeten Schriften klein. Das sorgt nicht nur für ein auch für ein effizientes Ladeverhalten deiner Seiten.
Bestehende Farben überarbeiten
Bei der Bearbeitung deiner Farbpalette verwende zuerst die in der Vorlage eingesetzten Farben für bestimmte Bereiche und Anwendungen, wie zB. "Firmenfarbe" (= markante Farbe des Corporate Designs), "Fehlermeldung", "Hintergrund" usw., bevor du neue, andere Farben hinzufügst.
Die bestehenden Farben sind bei jeder Vorlage bereits entsprechend zugeordnet. Wenn du diese vorhandenen Farben änderst, wirkt sich das also sofort auf alle Design-Elemente deines Projekts aus.
Globale Einstellungen anpassen
Als Nächstes sind die Globalen Einstellungen essenziell, um den Stil aller genutzten Design-Elementen (Slider, Banner, Galerien, Texte uvm.) mit wenig Handgriffen zentral zu definieren.
Unter "Shop" kannst du die Hintergrundfarbe für den Shop und das Schriftstyling für alle Lauftexte definieren. Das gilt auch generell für Dachzeile, Titel und Untertitel für alle Elemente.
Weiters sind Pfeile, Punkte und Pause-Buttons, die in Slidern, Galerien und Karussellen vorkommen, genauso zentral gestaltet wie Aufzählungen, Hyperlinks, Tabellen und Kontrastschalter für Banner- und Slidertexte.
Vertikale Abstände definieren
Die vertikalen Abstände zwischen den Sektionen sind ein zentrales Gestaltungselement für alle Seiten deines Projektes. Dafür sind in den Vorlagen Abstände vorbereitet. Du kannst diese anpassen und neue anlegen.
Durch diese Anpassung bestimmst du zentral den "Weißraum" zwischen den Elementen. Außerdem kannst du einen Standard-Abstand festlegen, der immer dann zum Einsatz kommt, wenn du eine neue Sektion auf deiner Seite anlegst.
Diese zentrale Einstellung ist entsprechend mächtig, aber du kannst auf den einzelnen Seiten beliebige individuelle Abstände festlegen und vorbereitete Abstände überschreiben.
Neben dem Abstandselement kannst du natürlich bei jedem Element Außen- und Innenabstände (Margin/Padding) und bei jeder Sektion einstellen.
Systembutton für alle Buttonstile
Der Systembutton ist die "Mastervorlage für alle Buttons, die für die Bedienung aller Shop-Elemente und Formulare vorbereitet sind. Alle Stil-Eigenschaften des Systembuttons werden automatisch auf alle anderen Buttons weiterverrerbt. Jede Änderung am Systembutton hat also weitreichende Auswirkung auf den Look deiner Buttons.
Du kannst aber die Stile aller anderen Funktions-Buttons (zB. Warenkorb, Kasse, Wunschliste, Formular senden usw.), die den Stil des Systembuttons erben, individuell anpassen.
Darüber hinaus kannst du unabhängig vom Stil des Systembuttons beliebig viele eigene Button-Stile anlegen, damit du das Buttonstyling auf jeder Seite nach deinen Vorstellungen individualisieren kannst.
The accessible Shopando website was also created with the Shopando website editor!