Theme-Einstellungen

Du kannst unter Verwendung von Theme-Einstellungen Änderungen an der Typografie, den Farben, den Social-Media-Links und der Warenkorbseite für deinen Onlineshop vornehmen. Wenn du Änderungen an deinen Theme-Einstellungen vornimmst, gelten die Änderungen für deinen gesamten Onlineshop.

Du kannst ein Logo für dein Unternehmen zu deinem Onlineshop hinzufügen. Dein Logo wird an den folgenden Stellen angezeigt:

  • dein Header auf allen Seiten
  • deine Passwortseite

Dein Logo anpassen

Logobilder haben eine maximale Breite von 300 Pixel.

Schritte:

Hinzufügen eines Favicon

Du kannst ein Favoritensymbol oder Favicon hinzufügen, das dir beim Branding deines Onlineshops helfen kann. Ein Favicon wird an den folgenden Stellen angezeigt:

  • im Tab deines Webbrowsers
  • im Verlauf deines Webbrowsers
  • Symbole auf deinem Desktop
  • neben dem Namen deines Onlineshops, wenn deine Website zu den Lesezeichen hinzugefügt wird

Erfahre mehr über Favicons.

Schritte:

Farben

Du kannst bis zu 21 einzigartige Farbschemas erstellen und anpassen und sie auf verschiedene Abschnitte in deinem Onlineshop anwenden. Mehr Informationen über Farboptionen, Farbschemas und Farbverläufe.

Schritte:

Typografie

Du kannst die Schriftart und Schriftgröße für Texte in deinem Onlineshop festlegen. Du kannst eine Systemschriftart oder eine benutzerdefinierte Schriftart auswählen.

Du solltest in Erwägung ziehen,Systemschriftarten in deinem Shop zu verwenden, da Systemschriftarten bereits auf dem Computer eines Benutzers installiert sind. Die Verwendung von Systemschriftarten verhindert, dass neue Schriftarten auf den Computer deines Kunden heruntergeladen werden, was sich negativ auf die Ladegeschwindigkeit deines Shops auswirken kann. Die Schriftart, die auf dem Computer deines Kunden angezeigt wird, hängt von dessen Betriebssystem ab.

Schriftarten anpassen

Eine Liste der verfügbaren Schriftarten findest du in der Schriftartenbibliothek von Shopify.

Schritte:

Schriftgrößen anpassen

Du kannst die Standardschriftgröße für deine Überschriften und Fließtext in der Theme-Einstellung "Typografie" festlegen.

Die Mindestschriftgröße ist 100 %, die maximale Schriftgröße ist 150 %. Mit jedem Schritt auf der Skala wird die Schriftgröße um 5 % erhöht. Die Standardeinstellung ist 100 %.

Schritte:

Layout

Du kannst die maximale Breite festlegen, in der dein Onlineshop angezeigt werden soll, und den vertikalen und horizontalen Abstand zwischen Abschnitten einstellen.

Schritte:

Animationen

Mit Animationen kannst du deinem Onlineshop Bewegung und interessante visuelle Aspekte hinzufügen. Du kannst eine Einblendungs-Animation aktivieren, die die Abschnitte deines Shops erst beim Scrollen anzeigt, oder einen Hover-Effekt auf deine Karten und Schaltflächen anwenden.

Schritte:

Ränder und Schatten

Du kannst die Ränder und Schatten einiger interaktiver Inhaltstypen wie von Einschüben, Schaltflächen, Varianten-Kapseln oder Mengeneingaben des Produkts anpassen.

Anpassbare Optionen für Ränder sind:

  • Dicke, wodurch der Umriss des Artikels geändert wird.
  • Opazität, wodurch die Sichtbarkeit des Artikelumrisses bestimmt wird.
  • Eckenradius, der die Ecken deiner Artikel abrundet.

Anpassbare Optionen für Schatten sind:

  • Deckkraft, wodurch die Sichtbarkeit des Artikelschattens geändert wird. Eine Schattendeckkraft von 0 % entfernt den Schatten des Artikels vollständig.
  • Offset-Schieberegler Horizontal und Vertikal, die die Position des Schattens um den Artikel verschieben.
  • Schieberegler Weichzeichnen, der die Opazität des Schattens des Artikels ändert.

Schaltflächen

Du kannst die Einstellungen für Call-to-Action-Schaltflächen in deinem Onlineshop anpassen, indem du Schatten hinzufügst, den Abstand oder die Deckkraft änderst und die Form deiner Schaltflächen anpasst.

Beispiel-Onlineshop mit Call-to-Action-Schaltfläche

Schritte:

Varianten-Kapseln

Mit Varianten-Kapseln kannst du die Varianten eines Produkts auf einer Produktseite oder in einem Abschnitt mit einem vorgestellten Produkt anzeigen. Kunden können die gewünschte Variante auswählen, um das Produkt zu ihrem Warenkorb hinzuzufügen, ohne zu anderen Produktseiten wechseln zu müssen. Du kannst anpassen, wie deine Varianten-Kapseln in deinem Onlineshop angezeigt werden.

Beispiel-Onlineshop mit wählbaren Varianten-Kapseln

Schritte:

Eingaben

Eingaben sind interaktive Bereiche, für die Kundeneingaben erforderlich sind, zum Beispiel eine Mengenauswahl, ein E-Mail-Anmeldeformular oder Warenkorbanmerkungen. Du kannst das Erscheinungsbild deiner Onlineshop-Eingaben anpassen.

Beispiel-Onlineshop mit Mengeneingabe

Schritte:

Karten

Mit den Einstellungen für Produktkarten, Kollektionskarten und Blog-Karten kannst du den Stil jeder Kartenart anpassen, wenn sie in Seitenabschnitten angezeigt wird. Du kannst die Farbe, Ausrichtung, Bild-Padding, Ränder und Schatten dieser drei Arten von Abschnittskarten ändern.

Schritte:

Inhalts-Container

Container werden für Textelemente der Inhaltsabschnitte verwendet, z. B. das Textfeld in einer Slideshow, einem Bildbanner oder den Spalten in Abschnitten mit mehreren Spalten. Du kannst das Erscheinungsbild von Inhalts-Containern für deinen Onlineshop anpassen.

Schritte:

Medien

Medien sind die visuelle Komponente von Abschnitten, z. B. Produktmedien oder ein Bild im "Bild mit Text"-Abschnitt. Du kannst Ränder und Schatten zu deinen Medien hinzufügen.

Schritte:

Du kannst das Erscheinungsbild von Navigations-Dropdown-Listen, Pop-up-Modals und Warenkorb-Pop-Ups in deinem Onlineshop anpassen.

Schritte:

Einschübe

Einschübe sind verborgene, interaktive Container, die eingeblendet werden, wenn darauf geklickt oder getippt wird, z. B. ein einklappbares Navigationsmenü oder Filteroptionen für Kollektionen. Du kannst den Rand und den Schatten der Einschübe in deinem Onlineshop anpassen.

Schritte:

Badges

Die Badges Sale und Ausverkauft werden automatisch zu deinen Produktbildern hinzugefügt, wenn du den Preis reduzierst oder wenn die Inventaranzahl 0 erreicht. Du kannst die Position, Form und Farbe deiner Badges Sale und Ausverkauft anpassen.

Beispiel-Onlineshop mit den Badges

Die Badges Seite und Blog werden in relevanten Suchergebnissen angezeigt. Du kannst die Position und Form dieser Badges anpassen. Die Farbe der Badges Seite und Blog kannst du jedoch nicht ändern.

Schritte:

Markeninformationen

Du kannst in deinem Onlineshop Informationen über deine Marke hinzufügen. Wenn du die folgenden Schritte abgeschlossen hast, kannst du den Block Markeninformationen in der Fußzeile deines Onlineshops hinzufügen.

Schritte:

Social Media

Du kannst Links zu deinen Social-Media-Konten hinzufügen, die in der Fußzeile deines Onlineshops angezeigt werden.

Schritte:

Suchverhalten

Dein Onlineshop enthält eine Suchfunktion mit Vorauswahl, die Vorschläge anzeigt, wenn Kunden mit der Eingabe in das Suchfeld beginnen. Suchvorschläge können Kunden dabei helfen, ihre Suchanfragen zu formulieren und anzupassen, und ihnen neue Möglichkeiten zur Entdeckung deines Onlineshops bieten. Kunden können mit Suchvorschlägen auch schnell nach Ergebnissen suchen, ohne dass sie ihre aktuelle Seite verlassen müssen, um eine separate Liste der Suchergebnisse anzuzeigen.

Mehr Informationen darüber, wie Suchvorschläge funktionieren, findest du unter Suche mit Vorauswahl.

Du kannst anpassen, wie deinen Kunden Suchvorschläge angezeigt werden.

Schritte:

Währungsformat

Du kannst festlegen, dass der Währungscode zusammen mit den Preisen auf deinen Produkten angezeigt wird.

Schritte:

Warenkorb

Du kannst den Stil des Warenkorbs in deinem Onlineshop ändern. Wenn ein Kunde ein Produkt aus deinem Shop zum Warenkorb hinzufügt, kann der Warenkorb als Einschub, eine Seite oder eine Popup-Benachrichtigung angezeigt werden. Um den Kunden auf der Produktseite zu halten, benutze die Option "Einschub" oder "Pop-up-Benachrichtigung". Um den Kunden zur Warenkorbseite zu bringen, verwende die Seitenoption. Wenn der Warenkorb des Kunden leer ist, kannst du im Warenkorbeinschub eine vorgestellte Kollektion einblenden.

Schritte:

Benutzerdefiniertes CSS

Im Abschnitt Benutzerdefiniertes CSS kannst du deinen eigenen CSS-Code eingeben, um beispielsweise das Erscheinungsbild der Schaltflächen deines Onlineshops über die verfügbaren Standardeinstellungen hinaus anzupassen oder ein eindeutiges Styling auf bestimmte Textelemente anzuwenden.

Benutzerdefiniertes CSS in deinen Theme-Einstellungen wirkt sich auf alle Seiten in deinem Onlineshop aus, mit Ausnahme deines Checkouts.

Mehr Informationen über Hinzufügen von benutzerdefiniertem CSS zu deinem Theme.

Theme-Design

Ein Theme-Stil ist eine Sammlung von Einstellungen, die vom Theme-Designer ausgewählt wurden. Du kannst einen Theme-Stil auf deinen Shop anwenden, um dessen Erscheinungsbild aufzupolieren. Für alle Themes wird standardmäßig ein Theme-Stil verwendet. Deine weiteren Optionen für Theme-Stile hängen davon ab, welches Theme du verwendest.

Wenn du ein Theme anpasst, ersetzt du die Theme-Stil-Einstellungen durch deine eigenen. Wenn du einen Theme-Stil auf dein Theme anwendest, kannst du deine aktuellen Einstellungen, wie z. B. Farben und Typografie, ändern.

Schritte:

Änderungen rückgängig machen und wiederholen

Mit der Schaltfläche Rückgängig machen machst du deine letzte Änderung rückgängig und mit der Schaltfläche Wiederherstellen wird eine Änderung wieder hinzugefügt, die du rückgängig gemacht hast. Wenn du mehrmals auf die Schaltfläche Rückgängig machen klickst, werden deine Änderungen eine nach der anderen rückgängig gemacht. Die Schaltflächen Rückgängig machen und Wiederherstellen sind in der Theme-Editor-Toolbar zu finden.

Die Schaltflächen Rückgängig machen und Wiederholen in der Toolbar des Theme-Editors

Klicke auf die Schaltfläche Rückgängig machen, um Änderungen, die du an deinem Theme vorgenommen hast, rückgängig zu machen, einschließlich der folgenden Beispiele:

  • Abschnitte hinzufügen, neu anordnen und löschen
  • Anwendung von Farben, Schriftarten und anderen Theme-Einstellungen
  • Einen Theme-Stil zurücksetzen.

Bereit, mit Shopify zu verkaufen?

Kostenlos testen