Style-Änderungen vornehmen
Zuletzt aktualisiert: 8. März 2019 18:35
Website-Stil-Änderungen sind Bearbeitungen des Erscheinungsbildes Ihrer Website, wie z. B. Schriftarten, Farben, Hintergründe und Abstände. Sie können über das Menü „Website-Stil“ Stil-Änderungen vornehmen und dort auch eine Vorschau erhalten.
Im Menü „Website-Stil“ jedes Templates finden Sie unterschiedliche Optionen, die als „Anpassungen“ bezeichnet werden. In dieser Anleitung erfahren Sie, wie Sie den Website-Stil-Editor einsetzen können, um das Design Ihrer Website zu perfektionieren. Darüber hinaus werden sämtliche Anpassungen erklärt, die Sie in unseren Vorlagen finden.
Wir empfehlen, dass Sie mit dem Website-Stil-Editor experimentieren, während Sie Ihre Website erstellen. Indem Sie die Anpassungen Ihrer Vorlage ausprobieren, erhalten Sie einen Eindruck davon, welche Möglichkeiten Ihr Template bietet und wie Sie ein Design erhalten können, das wirklich Ihren Vorstellungen entspricht.
Tipp: Das Menü „Website-Stil“ wurde zuvor als „Website-Stil-Editor“ bezeichnet.
Ein Video anschauen
Öffnen Sie Website-Stil
Klicken Sie im Hauptmenü auf Seiten. Öffnen Sie eine Seite, auf der die Änderungen angewendet werden sollen. Dies veranlasst Website-Stile, nur Optionen anzuzeigen, die für die angezeigte Seite relevant sind, und Sie erhalten eine Vorschau Ihrer Änderungen. (Wenn Sie eine Funktion verändern, die für die gesamte Website gilt, wie z. B. Navigationsmenüs oder eine Fußzeile, können Sie eine beliebige Seite öffnen.)
When you're on the right page, double-click Pages at the top of the panel to return to the Home Menu. Click Design, and then click Site Styles. The Site Styles panel will open with a list of editable style tweaks.
Die Anpassungen sind Bereich gruppiert, wie General (Allgemein), Site Header (Kopfzeile) und Main Content (Hauptinhalte). Die für Ihr Template spezifischen Anpassungen finden Sie gewöhnlich unter Options (Optionen).
Klicken Sie auf die einzelnen Anpassungen, um Änderungen durchzuführen.
Hinweis: Die Bearbeitung der Website ist deaktiviert, wenn Website-Stil geöffnet ist. Um Inhalte hinzuzufügen oder zu entfernen, schließen Sie Website-Stil und öffnen Sie das Seiten-Menü.
Seiten-spezifische Styles ansehen
Wenn Sie die Vorschau eines der folgenden Seiten-Typen in Website-Stil betrachten, sehen Sie einen Abschnitt mit Anpassungen, die für diesen Seiten-Typ spezifisch sind. Um diese Anpassungen anzuzeigen, öffnen Sie zunächst die Seite und navigieren Sie anschließend zu Website-Stil.
Cover-Seite (Beachten Sie den unteren Hinweis)
Blog-Seite
Galerie-Seite
Index-Seite
Produkt-Seite
Jegliche Änderungen dieser Verfeinerungen gelten für alle Seiten des gleichen Typs innerhalb Ihrer Website. Zum Beispiel, wenn Sie mehrere Produkt-Seiten angelegt haben und Style-Änderungen spezifisch für Produkt-Seiten durchführen, dann gelten diese Änderungen für alle Produkt-Seiten. Dies verleiht Ihrer Website ein einheitliches Erscheinungsbild.
Einige Sammlungsinhalte wie etwa Blogeinträge oder Veranstaltungen verfügen außerdem über inhaltsspezifische Anpassungen in Website-Stil. Öffnen Sie Website-Stil, während Sie einen einzelnen Sammlungsinhalt betrachten, um Änderungen vorzunehmen.
Hinweis: Wenn eine Titelseite in Website-Stil geöffnet ist, werden Ihnen nur Titelseiten-Anpassungen angezeigt. Mehr dazu erfahren Sie unter Eine Titelseite gestalten.
Eine Style-Anpassung finden
Klicken Sie in Website-Stil auf einen Bereich einer Seite, um nur die für diesen Seitenbereich verfügbaren Stil-Anpassungen anzuzeigen und die übrigen Anpassungen auszublenden. Der Stil-Highlighter-Rahmen erscheint rund um das angeklickte Element. Diese Abkürzung steht in den meisten Templates und für die meisten Bereiche Ihrer Website zur Verfügung.
Zur Änderung des Erscheinungsbildes Ihres Navigationsmenüs können Sie beispielsweise in der Vorschau auf einen Navigationslink klicken. Die Stil-Anpassungen, die das Navigationsmenü steuern, werden, wie im Beispiel unten zu sehen, in Website-Stil angezeigt. Die restlichen Stil-Anpassungen werden ausgeblendet.
Kehren Sie zu der Anzeige aller Optionen zurück, indem Sie auf Show All (Alle anzeigen) klicken.
Hinweis: Eine vollständige Liste aller Anpassungen Ihres Templates finden Sie in unserer Liste der Anleitungen für „Website-Stil-Anpassungen“.
Einige Anpassungen können in der Vorschau angeklickt und verschoben werden, um die Einstellungen anzupassen:
Häufige Style-Änderungen
Während Website-Stil für jedes Template über Dutzende von Anpassungen verfügt, gibt es einige Aspekte, die alle gemeinsam haben.
Um Schriftart und Schriftgröße zu ändern, benutzen Sie die Anpassungen für Typography (Typographie)oder Font (Schriftart) . Näheres erfahren Sie hier: Schriftarten ändern.
Um die Farben zu ändern, wählen Sie irgendeine Anpassung mit einem color circle (Farbkreis) neben der Beschriftung aus. Näheres erfahren Sie hier: Farben ändern.
Größen und Werte
Viele Style-Änderungen sind mit der Größe verbunden, wie Padding, Abstände, Breiten oder Rahmen. Diese Verfeinerungen können unter der Überschrift Sizes & Values (Größen und Werte) gefunden werden. In Abhängigkeit von Ihrem Template können sie ebenfalls in anderen Bereichen zu finden sein. Die Größen werden gewöhnlich in Pixel (px) angegeben.
Um diese Style-Änderung durchzuführen, fahren Sie mit der Maus über eine Größen-Verfeinerung. Benutzen Sie den Schieberegler oder geben Sie eine Zahl in das Feld ein.
Das Seitenverhältnis eines Bildes besteht aus dem Verhältnis seiner Höhe zu seiner Breite und wird als Zahl ausgedrückt, wie 3:4. Wenn Sie eine Seitenverhältnis-Anpassung auswählen, wird das Bild gewöhnlich unter Bezugnahme auf den Fokuspunkt auf diese Form zugeschnitten (wie 1:1 Square (Quadrat)).
Wenn das Seitenverhältnis auf Auto (Automatisch)eingestellt ist, wird das Bild so angepasst, wie es am besten auf die Seite passt. Es kann sein, dass die Bilder in einer anderen Reihenfolge angezeigt werden, als sie hochgeladen worden sind.
Einige Vorlagen unterstützen ein Hintergrundbild, das für einzelne Seiten oder die gesamte Website über Website-Stil hinzugefügt werden kann. Um solch ein Bild hinzuzufügen, klicken Sie auf die Anpassung Hintergrundbild oder das entsprechende Bild-Symbol unter Website-Stil. Sie können Ihr eigenes Bild hochladen oder ein Agenturbild suchen und hinzufügen.
Erfahren Sie mehr unter Ein Hintergrundbild hinzufügen.
Banner-Bild
Einige Vorlagen unterstützen ein Banner-Bild, das für die gesamte Website gilt und über Website-Stil hinzugefügt werden kann. Klicken Sie auf die Anpassung Banner-Bild, Kopfzeilen-Bild oder auf das entsprechende Bild-Symbol in Website-Stil.
Um Bilder für einzelne Seiten hinzuzufügen, öffnen Sie die Seiteneinstellungen der jeweiligen Seite, klicken Sie auf den Reiter Media (Medien) und laden Sie dann ein Bild hoch.
Erfahren Sie mehr unter Ein Banner-Bild hinzufügen.
Wenn Ihre Vorlage eine Seitenleiste beinhaltet, können Sie deren Erscheinungsbild in Website-Stil verändern. Zum Beispiel, können Sie in einigen Vorlagen die Seitenleiste rechts oder links anzeigen lassen. Um die Stil-Anpassungen für die Seitenleiste zu sehen, klicken Sie auf die Seitenleiste in der Seitenvorschau oder suchen Sie in Website-Stil nach der Überschrift Seitenleiste.
Hier sehen Sie ein Beispiel, wie eine Seitenleisten-Anpassung von Ihrem Template aussehen kann.
Ausblenden und Einblenden
In einigen Vorlagen können Sie Designmerkmale wie Seitentitel, Symbole sozialer Netzwerke, Rahmen, Banner und Fußzeilen ausblenden. Diese Anpassungen werden in der Regel über Kontrollkästchen vorgenommen, die im Abschnitt Optionen zu finden sind.
Eine Style-Änderung rückgängig machen
Style-Änderungen können auf zwei unterschiedlichen Wegen rückgängig gemacht werden:
Klicken Sie oben im Menü auf das Zurücksetzen-Symbol. Damit heben Sie die letzte vorgenommene Stil-Änderung auf. Klicken Sie mehrmals auf das Symbol, um fortlaufend weitere Änderungen rückgängig zu machen. Alternativ lässt sich eine Änderung auch per Klick auf das Wiederherstellen-Symbol erneut vornehmen.
Klicken Sie auf den Punkt neben der geänderten Anpassung. Damit lassen sich bestimmte Style-Änderungen in beliebiger Reihenfolge rückgängig machen. Die Punkte werden eingeblendet, bis Sie Ihre Änderungen gespeichert haben.
Hinweis: Wenn Sie eine Style-Änderung durchführen und diese anschließend wieder rückgängig machen, wird die Speichern-Option oben im Menü nicht angezeigt. Die Speichern-Option erscheint nur, wenn Sie eine Anpassung ändern und dies beibehalten.
After you’ve made all changes and like what you see, click Save in the top left corner. The changes will appear on your live site.
Hinweis: Diese Änderung ist nicht umkehrbar. Sie können den Standard-Style des Templates wiederherstellen, jedoch keine vorangegangenen Style-Änderungen.
Zurücksetzen auf Standard-Style
Um noch einmal von vorne zu beginnen, können Sie den Stil Ihrer Website auf die Standard-Einstellungen Ihrer Vorlage zurücksetzen. Auf diese Weise lassen sich die ursprünglichen Schriftarten, Farben und auch der Freiraum der Vorlage wiederherstellen.
Scrollen Sie bis zum unteren Ende von Website-Stil und klicken Sie auf Stile auf Standard zurücksetzen.
Prüfen Sie die Bestätigungsmeldung und klicken Sie dann auf Reset (Zurücksetzen).
Nach dem Speichern in Website-Stil wird Ihr Template dann auf das ursprüngliche Standard-Design zurückgesetzt.
Hinweis: Nach dem Speichern in Website-Stil kann diese Änderung nicht mehr rückgängig gemacht werden.
Benutzerdefinierte CSS hinzufügen
Website-Stil steuert die CSS Ihrer Website ohne benutzerdefinierten Code. Wenn Sie mit CSS vertraut sind und eine Änderung, die Sie benötigen, in Website-Stil nicht finden können, besteht jedoch die Möglichkeit, CSS im CSS-Editor hinzuzufügen.
Benutzerdefinierte CSS kann die Funktionalität Ihrer Website beeinträchtigen und sämtliche benutzerdefinierten Codes übersteigen den Rahmen der Kundenbetreuung von Squarespace.
Weitere Hilfestellungen erhalten Sie hier: Häufig gestellte Fragen zu Style-Änderungen.
Den Style Ihres Templates erkunden
Jedes Template bietet eigene Style-Optionen und Standardeinstellungen. Näheres zu den verschiedenen Styles eines Templates erfahren Sie in der folgenden Liste und der entsprechenden Anleitung Ihres Templates. Die Templates sind in Gruppen eingeteilt.
Die Anleitungen zu Struktur und Style enthalten Erklärungen zu den Style-Optionen Ihres Templates sowie entsprechende Beispielbilder. Dies ist ein großartiger Ausgangspunkt, wenn Sie gerade erst am Anfang Ihres Projekts stehen.
Die Anleitungen zu Website-Stil-Anpassungen führen alle verfügbaren Anpassungen für Ihr Template auf. Dies ist ein guter Bezugspunkt, wenn Sie nicht mehr genau wissen, wie eine Anpassung bezeichnet wird oder in welchem Abschnitt von Website-Stil diese sich befindet.
Adirondack Struktur und Style Website-Stil-Anpassungen
Avenue Struktur und Style Website-Stil-Anpassungen
Aviator-Gruppe
Struktur und Style Website-Stil-Anpassungen
Farro-Gruppe
Five Struktur und Style Website-Stil-Anpassungen
Flatiron Struktur und Style Website-Stil-Anpassungen
Forte Struktur und Style Website-Stil-Anpassungen
Galapagos Struktur und Style Website-Stil-Anpassungen
Ishimoto Struktur und Style Website-Stil-Anpassungen
Momentum Struktur und Style Website-Stil-Anpassungen
Native Struktur und Style Website-Stil-Anpassungen
Supply Struktur und Style Website-Stil-Anpassungen
Wells Struktur und Style Website-Stil-Anpassungen
Wexley Struktur und Style Website-Stil-Anpassungen
Menü- und Panel-Updates (November 2018)
Erste Schritte mit Squarespace E-Mail Marketing
Vorlagen und Design
Style-Änderungen