Sie können die Hintergrundfarbe von Inhaltselementen bearbeiten, um Ihre Markenfarben zu nutzen und Ihren Shop so zu gestalten, dass er Ihrem Unternehmensauftritt und / oder Ihrem persönlichen Geschmack entspricht. Sie können Hintergrundfarben auf verschiedene Weisen nutzen. Wenn Sie nur die Hintergrundfarbe eines Inhaltselementes bearbeiten, wird dieses Inhaltselement hervorgehoben und / oder Abwechslung in das Design Ihres Shops gebracht. Sie können auch die Hintergrundfarbe aller Inhaltselemente einer Seite bearbeiten und so den Hintergrund der gesamten Seite verändern.
Springen Sie zu:
So bearbeiten Sie die Hintergrundfarbe
Sobald Sie ein Inhaltselement zu Ihrem Shop hinzugefügt haben, können Sie dessen Hintergrundfarbe wie folgt verändern:
- Wählen Sie das Inhaltselement oder bewegen Sie Ihre Maus darüber. Sie sehen dann einen blauen Balken im oberen Bereich des Inhaltselementes.
- Im blauen Balken, wählen Sie
.
- Sie können nun die Hintergrundfarbe bearbeiten. Wählen Sie die gewünschte Farbe aus der Farbpalette aus oder geben Sie einen Hex-Code im Eingabefeld ein. Unter der Farbpalette finden Sie auch voreingestellte Farben. Zu diesen Farben gehören immer die Basisfarben Schwarz und Weiß. Außerdem sehen Sie dort die Farben Ihrer gewählten Design-Vorlage. Wenn Sie die Farben Ihrer Design-Vorlage geändert haben, sehen Sie die von Ihnen festgelegten Farben.
Wie Sie in dem obigen Beispiel sehen können, wird Ihnen direkt angezeigt, wie Ihre Änderungen in Ihrem Shop aussehen werden.Sie können jederzeit Zurücksetzen wählen, um die Standardeinstellung für die Hintergrundfarbe des Inhaltselements wiederherzustellen. Seien Sie sich jedoch bitte bewusst, dass Sie die Standardeinstellung wiederherstellen, nicht die Farbe, die Sie ausgewählt hatten als Sie mit dem Bearbeiten begonnen haben (falls Sie vorher bereits eine Hintergrundfarbe gewählt hatten, die von der Standardeinstellung abweicht). Wenn Sie die Farbe beibehalten möchten, die ausgewählt war, als Sie mit dem Bearbeiten begonnen haben, wählen Sie Abbrechen. - Wenn Sie Ihre vorgenommenen Änderungen speichern möchten, wählen Sie Speichern.
Ihre Änderungen sind nun in Ihrem Shop sichtbar. Wenn Sie für Ihren Shop eine Design-Vorlage mit einem Header nutzen, der über die volle Seitenbreite angezeigt wird, wird auch die Hintergrundfarbe über die volle Seitenbreite geändert. Wenn das nicht der Fall ist, wird auch die Hintergrundfarbe nicht über die volle Seitenbreite geändert. Hierdurch wird ein harmonisches und konsistentes Design für Ihren Shop gewährleistet.
Wenn Sie die Hintergrundfarbe für zwei aufeinanderfolgende Inhaltselemente bearbeiten, müssen Sie sich keine Gedanken über den weißen Bereich zwischen den beiden Inhaltselementen machen, der in Ihrem Editor weiterhin zu sehen ist. Dieser weiße Bereich ermöglicht es Ihnen, einen guten Überblick über die einzelnen Inhaltselemente zu erhalten, ist für Ihre Besucher in Ihrem Shop jedoch nicht sichtbar.
Tipps und Tricks
Farbeinstellungen bieten Ihnen viele Möglichkeiten, können jedoch auch zu einer Herausforderung werden. Um Sie hierbei zu unterstützen, haben wir einige Tipps und Tricks für Sie zusammengestellt:
- Nutzen Sie Farben, die zu Ihrer Marke oder Ihrem Unternehmen passen und die Ihre Kunden bereits kennen. Hierdurch wird das Vertrauen in Ihren Shop gestärkt und ein ganzheitliches Design unterstützt.
- Manchmal ist weniger mehr. Insbesondere, wenn Sie die Hintergrundfarbe von Inhaltselementen bearbeiten, die Ihre Produktpalette präsentieren, sollten Sie eine helle Hintergrundfarbe wählen, damit Ihre Besucher sich auf Ihre Produkte konzentrieren können.
- Wenn Sie die Hintergrundfarbe von Inhaltselementen bearbeiten, für die Sie nicht alle Komponentenfarben selbst einstellen können (wie beispielsweise die Farbe des Abschicken Buttons auf dem Kontaktformular), sollten Sie eine helle Hintergrundfarbe wählen, die zu den Farben des Inhaltselements passt.
- Versuchen Sie, Farben derselben Farbfamilie zu nutzen. Zu viele verschiedene Farben in Ihrem Shop können Ihre Besucher ablenken. Stellen Sie dennoch sicher, dass der Farbkontrast zwischen Texten, Links, Buttons und Ihrer Hintergrundfarbe hoch ist, damit die Lesbarkeit nicht eingeschränkt wird.
Hier sehen Sie abschließend ein Beispiel mit einer Hintergrundfarbe, die zur der selben Farbfamilie gehört wie die Überschriften. Dennoch ist der Kontrast hoch und die Überschrift leicht lesbar. Da auch das Bild Farben aus der Farbfamilie aufgreift, wirkt die Seite harmonisch und bildet eine Einheit: