Style-Änderungen vornehmen

Klicke zum Öffnen des Menüs „Website-Stile“ auf das Pinsel-Symbol rechts oben, während du eine beliebige Seite bearbeitest.

Klicke von dort aus auf das Website-Element, das du ändern möchtest, z. B. Schriftarten oder Farben. In dieser Anleitung findest du eine detailliertere Beschreibungen der Schritte für die einzelnen Menüs.

Um Website-Stil zu schließen, doppelklicke auf die Seitenvorschau, klicke auf das Pinselsymbol oder klicke oben im Menü auf Schließen. Deine Stil-Änderungen bleiben intakt, bis du sie speicherst oder rückgängig machst.

Wenn Website-Stile geschlossen ist, kannst du fein abgestimmte Änderungen vornehmen, indem du einen bestimmten Abschnitt bearbeitest. Um einen Abschnitt zu gestalten, bewege den Mauszeiger über den Abschnitt und klicke dann auf Abschnitt bearbeiten oder auf das Bleistiftsymbol. Abschnittsstile haben Vorrang vor Stilen für die gesamte Website.

Hier kannst du außerdem verschiedene Layouts für Auto-Layout-, Sammlungs- und Galerie-Abschnitte auswählen. Wenn du Stil-Änderungen an einem Sammlungs-Abschnitt vornimmst, wirkt sich dies auf alle Layouts dieses Typs aus. Wenn du beispielsweise über zwei Blog-Abschnitte verfügst, die beide ein Mauerwerk-Layout verwenden, wirken sich alle Stiländerungen, die du an einem Abschnitt vornimmst, auf beide Abschnitte aus.

So öffnen Sie Website-Stile.

1. Öffne das Menü „Seiten“.
2. Klicke auf die Seite, die du gestalten möchtest. Für Funktionen auf der gesamten Website wie Footer kannst du eine beliebige Seite öffnen. Öffne für Sammlungsinhalte einen beliebigen Sammlungsinhalt des jeweiligen Typs (z. B. einen Blogeintrag oder einen Produktartikel).
3. Klicke oben links im Seiten-Menü auf Website, klicke auf Design und dann auf Website-Stile.
4. Klicke im Menü „Website-Stil“ auf eine beliebige Anpassung, um Änderungen vorzunehmen.

Die Bearbeitung der Website ist deaktiviert, wenn Website-Stile geöffnet ist. Um Inhalte hinzuzufügen oder zu entfernen, schließen Sie Website-Stile und öffnen Sie das Seiten-Menü.

„Website-Stile“ zeigt Optionen für die Seite an, auf der du dich gerade befindest. Alle Änderungen an diesen Anpassungen gelten für alle Seiten dieses Typs auf deiner Website. Wenn du beispielsweise Stiländerungen an einer Shop-Seite vornimmst, werden diese für alle Shop-Seiten auf deiner Website übernommen.

Tipp: Jede Cover-Seite wird separat gestaltet.

Klicke im Vorschaufenster auf einen Bereich einer Seite, um die für diesen Bereich verfügbaren Stil-Anpassungen anzuzeigen und den Rest auszublenden. Es erscheint ein Stil-Highlighter-Rahmen rund um das angeklickte Element. Kehre zu der Anzeige aller Optionen zurück, indem du auf Alle anzeigen klickst. Diese Abkürzung steht in den meisten Vorlagen und für die meisten Bereiche deiner Website zur Verfügung.

So könnte das beim Template „Brine“ aussehen:

Einige Anpassungen können in der Vorschau angeklickt und verschoben werden, um die Einstellungen anzupassen:

Stiländerungen in der App funktionieren je nach Version deiner Website unterschiedlich.

Version 7.1-Stile in der App

Mit Website-Stil kannst du per Fingerdruck große Stil-Änderungen auf deine Website anwenden, einschließlich Änderungen an Schriftart, Farbe und Abständen. Änderungen, die du unter Website-Stil vornimmst, gelten normalerweise für die gesamte Website. Du kannst jedoch fein abgestimmte Änderungen durchführen, indem du bestimmte Abschnitte oder Textbereiche gestaltest.

So nimmst du Stil-Änderungen vor:

1. Tippe auf eine beliebige Seite deiner Website und dann auf Bearbeiten oder das Bleistiftsymbol.
2. Tippe auf das Pinselsymbol, um Website-Stil zu öffnen. 
3. Tippen Sie auf den Websitebereich, den Sie formatieren möchten, z. B. Schriftarten oder Farben.
4. Verwende die Optionen im Menü, um diesen Bereich anzupassen.
   • Tippe in Schriftarten auf Sans Serif, Serif oder Gemischt, um die Schriftarten-Pakete für jeden Typ zu überprüfen. Tippe auf den Schriftartnamen, um die Basisgröße zu ändern.
   • Wähle unter Farben für jedes Farbdesign eine Akzent-, helle und dunkle Farbe aus.

Tipp: Du kannst Website-Stile auch über das Menü Einstellungen öffnen.

So gestalten Sie einen Abschnitt:

1. Öffnen Sie die Seite, die Sie bearbeiten möchten, und tippen Sie dann auf Bearbeiten oder auf das Stift-Symbol.
2. Tippen Sie auf einen Abschnitt, den Sie formatieren möchten.
3. Tippe auf das Stift-Symbol in der Symbolleiste des Abschnitts.
4. Tippe auf Format, Hintergrund oder Farben und wähle einen neuen Stil aus.
5. Tippen Sie auf Fertig oder ✓ und dann auf Änderungen speichern.

Version 7.0-Stile in der App

Nimm Stil-Änderungen unter „Website-Stil“ vor:

1. Tippe auf Seiten und dann auf die Seite, auf der die Änderungen angewendet werden sollen. So zeigt Website-Stile nur Optionen an, die für die angezeigte Seite relevant sind, und du erhältst eine Vorschau deiner Änderungen. Wenn du eine Funktion veränderst, die für die gesamte Website gilt, wie z. B. Navigationsmenüs oder ein Footer, kannst du eine beliebige Seite öffnen.
2. Tippen Sie auf die Vorschauleiste, um die Seitenvorschau einzuklappen.
3. Tippe auf Einstellungen, dann auf Website-Einstellungen und schließlich auf Website-Stil.
4. Das Menü Website-Stile öffnet sich mit einer Liste der Stil-Anpassungen. Tippen Sie auf die einzelnen Anpassungen, um Änderungen durchzuführen.

Um eine Schriftart zu ändern, öffne Website-Stile und klicke dann auf Schriftarten.

Im Menü „Schriftarten“ kannst du ein Schriftartpaket auswählen, das auf den gesamten Text auf deiner Website angewendet werden soll, oder die Schriftart bestimmter Texttypen ändern. Mehr dazu erfährst du unter Schriftarten ändern.

In jedem Textbereich kannst du das Textformat auch zu einer Überschrift, einem Absatztext oder einem Text mit Festbreite ändern oder einen Link hinzufügen.

• Links sind immer unterstrichen.
• Wenn Besucher auf einen Link klicken, erscheint eine gepunktete Linie um den Link herum, was dazu beiträgt, deine Website für alle Besucher besser zugänglich zu machen.

Um Schriftarten und Schriftgrößen zu ändern, verwenden Sie die Änderungen an Typografie oder Schriftart in Website-Stilen. Weitere Informationen finden Sie unter Schriftarten ändern.

Um die Farben deiner Website zu ändern, öffne Website-Stile und klicke dann auf Farben.

Mit kuratierten Farbpaletten kannst du Änderungen an allen Farben deiner Website gleichzeitig vornehmen oder die Farben für einzelne Website-Elemente anpassen. Weitere Informationen zum Ändern von Website- und Abschnittsfarben findest du unter Farben ändern. Bewährte Methoden zur Barrierefreiheit findest du unter Barrierefreie Website-Inhalte erstellen.

Um die Farben zu ändern, wähle eine beliebige Website-Stil-Anpassung mit einem Farbkreis neben dem Label aus. Mehr dazu erfährst du unter Farben ändern. Bewährte Methoden zur Barrierefreiheit findest du unter Barrierefreie Website-Inhalte erstellen.

Klicke zum Bearbeiten der Kopfzeile deiner Website oben links in der Seitenvorschau auf Bearbeiten, bewege den Mauszeiger über die Kopfzeile und klicke dann auf Website-Kopfzeile bearbeiten. Anhand der Optionen im Editor kannst du deinen Website-Titel oder dein Logo und die Navigationslinks anpassen. Du kannst ein Warenkorb-Symbol, Social-Media-Symbole und einen CTA-Button (für eine Handlungsaufforderung) hinzufügen.

Ausführlichere Schritte finden Sie unter Erstellen einer Website-Kopfzeile.

Der Kopfzeilenstil deiner Website hängt von deinem Template ab. Weitere Informationen zu deinen spezifischen Kopfzeileneinstellungen findest du in der Anleitung für dein Template.

Manche Templates haben besondere Funktionen in der Kopfzeile. Eine Liste der verfügbaren Features findest du unter Erstellen einer Website-Kopfzeile.

So gestalten Sie die Fußzeile:

1. Klicke in der linken oberen Ecke auf Bearbeiten.
2. Bewegen Sie den Mauszeiger über den Footer und klicken Sie auf Footer bearbeiten.
3. Klicke auf Abschnitt bearbeiten oder auf das Bleistiftsymbol, um Stil-Änderungen vorzunehmen.

Mehr dazu erfährst du unter Footer bearbeiten.

Der Fußzeilenstil Ihrer Website hängt von Ihrem Template ab. Weitere Informationen zu Ihren spezifischen Fußzeileneinstellungen finden Sie in der Anleitung Ihres Template.

Weitere Informationen zu verschiedenen Fußzeilenoptionen nach Template finden Sie unter Fußzeilen bearbeiten.

Um den Abstand deiner Website zu ändern, öffne Website-Stile und klicke dann auf Abstände.

Diese Anpassungen ändern den Abstand auf allen Seiten deiner Website:

• Seitenbreite (max.) – Ändere die maximal mögliche Breite der Seiten deiner Website. Die tatsächliche Breite hängt von deinem Browser und Gerät ab. Diese Anpassung wirkt sich nicht auf die Abstände in der Kopfzeile deiner Website aus.
• Website: Rand – Ändere die Randbreite auf beiden Seiten deiner Website. Abhängig von deiner Einstellung für die Seitenbreite hat diese Anpassung möglicherweise keinen sichtbaren Effekt auf deinen Seiteninhalt. Diese Anpassung betrifft deine gesamte Website, einschließlich der Kopfzeile. In Galerie-Abschnitten ändert sich das Padding oben und unten im Verhältnis zur Randbreite.

Du kannst den Abstand einzelner Abschnitte im Abschnittseditor ändern.

Viele Größenänderungen wie Padding, Abstand, Breite und Rand befinden sich unter der Überschrift Größen& Werte. Je nach Template können sie sich auch in anderen Abschnitten befinden.

Um eine Größe zu ändern, bewegen Sie den Mauszeiger über eine Größenänderung. Verwenden Sie dann den Schieberegler oder geben Sie eine Zahl in das Feld ein.

Du kannst ein Banner-Bild auf jeder Seite erstellen, indem du oben auf der Seite einen Block-Abschnitt mit einem Hintergrundbild hinzufügst.

• Wenn Sie nur ein Bild in Ihrem Banner wünschen, beginnen Sie mit einem leeren Abschnitt.
• Alle Blöcke, die zum Abschnitt hinzugefügt werden, überlagern das Banner.
• Um die Höhe zu ändern, klicke auf Abschnitt bearbeiten oder auf das Bleistiftsymbol und lege die Abschnittshöhe fest.
• Wenn Sie ein Hintergrundbild auswählen, befolgen Sie unsere Tipps zur Bildformatierung.

Erfahren Sie mehr unter Banner-Bilder hinzufügen.

Die meisten Templates unterstützen Seiten-Banner, die du in den Einstellungen deiner Seite hinzufügen kannst.

• Alle Banner-Optionen nach Template-Gruppe geordnet findest du auf der Seite Banner-Bilder hinzufügen.
• Weitere Informationen zu den spezifischen Bannereinstellungen deiner Website findest du in der Anleitung zu Templates.

So ändern Sie den Hintergrund:

• Verwenden Sie das Farben-Menü, um den Website-Hintergrund zu ändern.
• Verwenden Sie den Abschnitt-Editor, um die Hintergrundfarbe einzelner Abschnitte zu ändern oder Hintergrundbilder oder Videos hinzuzufügen. Dazu gehören Fußzeilenabschnitte.
• Wenn für einen Abschnitt ein Hintergrundbild auf Einrückung gesetzt ist, können Sie die Einrückungs-Rahmenfarbe festlegen.
• Der Header hat die gleiche Hintergrundfarbe wie der oberste Abschnitt, wenn er transparent ist. Deaktiviere die Transparenz im Header-Editor, um ein anderes Farbschema für den Header festzulegen.

Du kannst die Hintergrundfarbe deines Hauptinhaltsbereichs in den Website-Stilen festlegen. Einige Templates bieten auch die Möglichkeit, eine Hintergrundfarbe zu Kopf- und Fußzeilen sowie zu anderen Bereichen um deinen Inhalt hinzuzufügen. Um mehr zu erfahren, besuche die Seite Farben ändern.

Einige Templates unterstützen ein Hintergrundbild, das über Website-Stil für einzelne Seiten oder die gesamte Website hinzugefügt werden kann. Klicke zum Hinzufügen eines solchen Bilds auf die Anpassung Hintergrundbilds oder das entsprechende Bild-Symbol unter Website-Stil. Du kannst dein eigenes Bild hochladen oder ein Agenturbild suchen und hinzufügen. Weitere Informationen findest du unter Hintergrundbilder für die gesamte Website in Version 7.0 hinzufügen.

Öffne zum Gestalten der Shop-Seite die Abschnittsstile des Shops. Es werden Optionen zum Ändern des Abschnittsformats, des Hintergrunds und der Farben angezeigt.

Um Produkte zu gestalten, öffne die Website-Stile deiner Produktdetail-Seite. Diese Einstellungen wirken sich auf die einzelnen Produktdetail-Seiten aus. Beachte, dass einige dieser Optionen nur für Produkte mit mehreren Bildern gelten, sodass einige Änderungen möglicherweise nicht angezeigt werden, wenn dein Produkt nur über ein Bild verfügt.

Mehr dazu erfährst du unter Shop-Seiten gestalten.

Die Stil-Optionen für deine Produkte hängen vom Template deiner Website ab und ob dein Template eine klassische, erweiterte oder einzigartige Shop-Seite verwendet.

Eine detaillierte Liste aller Produkt-Stil-Optionen findest du unter Shop-Seiten gestalten.

Du kannst bestimmte Design-Features wie Social-Media-Symbole, Banner und Fußzeilen ausblenden, indem du den Block oder Abschnitt löschst. Öffne den Abschnitts-Editor, um die verschiedenen Optionen für diesen Abschnitt der Seite zu erkunden.

In einigen Vorlagen können Sie Designmerkmale wie Seitentitel, Symbole sozialer Netzwerke, Ränder, Banner und Footer ausblenden. Diese Anpassungen werden in der Regel im Abschnitt Optionen der Website-Stile vorgenommen.