Sie können eine Site anpassen, indem Sie eine Kopfzeile entwerfen, ein Design erstellen oder eine Fußzeile hinzufügen. Eine Kopf- und eine Fußzeile sind für ein vollständiges Layout einer Site wichtig. In der Kopfzeile können Sie die Site vorstellen, indem Sie ein Branding hinzufügen und ein Menü erstellen, das Besucher bei der Suche nach Inhalten, Seiten und externen Websites unterstützt. Eine Fußzeile kennzeichnet das Ende der Site und bietet Platz für Details, beispielsweise Copyright-Informationen, den Standort und Kontaktinformationen der Organisation.
Anpassen der Kopfzeile
Jede Site hat eine Kopfzeile, die oben auf der Site (unter der globalen Navigationsleiste) und auf allen angefügten Seiten und Ansichten angezeigt wird. Die Kopfzeile enthält Titel, Logo und Menü-Links der Site. Sie können die Kopfzeile nicht entfernen, aber ihr Design ändern.
Führen Sie die folgenden Schritte aus, um die Kopfzeile anzupassen:
- Öffnen Sie eine Site im Bearbeitungsmodus.
- Klicken Sie im Fenster Anpassen auf Kopfzeile.
Tipp:
Wenn das Fenster Anpassen nicht angezeigt wird, klicken Sie auf die Umschaltfläche
, um es zu öffnen. - Wählen Sie im Menü Aussehen einen der folgenden Styles für Kopfzeile aus:
- Standard: Der Standard für jede neue Site. Dieses Design zeichnet sich durch eine dünne, kompakte Leiste aus, die Platz für ein Logo (60 Pixel) sowie Social Media- und Menü-Links bietet.
- Auffällig: Dieses Design bietet mehr Platz für größere Logos (130 Pixel) und zusätzliche Menü-Links.
- Benutzerdefiniertes HTML/CSS: Verwenden Sie einen syntaxfähigen Code-Editor, um eine Kopfzeile mit benutzerdefiniertem Code zu konfigurieren.
Wenn Benutzerdefiniertes HTML/CSS ausgewählt ist, wird ein Menü mit Parametern für HTML und CSS angezeigt. Klicken Sie auf HTML-Code-Editor öffnen oder CSS-Code-Editor öffnen
, um den Code für die benutzerdefinierte Kopfzeile zu schreiben.Hinweis:
Benutzerdefinierte Kopfzeilen werden auf allen Seiten der Site angezeigt, nicht aber auf Vorschauseiten.
Kopfzeilen-HTML bietet keine Unterstützung für eingebettetes JavaScript. Skript-Tags werden ignoriert.
- Wählen Sie für Layout die Option Box oder Breit aus.
- Geben Sie für Name und Kurzname einen Text ein.
Der Name, den Sie angeben, wird nur in der Kopfzeile angezeigt und nicht in die URL der Site oder in die Liste der Sites übernommen. Der Kurzname wird in der Kopfzeile angezeigt, wenn der vollständige Name für kleinere Bildschirme, wie z. B. auf Mobilgeräten, zu lang ist.
Wenn Sie nicht möchten, dass der Name der Site in der Kopfzeile angezeigt wird, können Sie den Parameter Name alternativ deaktivieren.
Hinweis:
In der Kopfzeile einer Site muss entweder ein Name oder ein Logo enthalten sein. Der Parameter Logo muss aktiviert werden, bevor der Parameter Name deaktiviert werden kann.
- Klicken Sie auf Layout speichern.
Hinzufügen eines Logos zur Kopfzeile
Sie können das Logo Ihrer Organisation zur Kopfzeile hinzufügen, um die Site mit Ihrem Branding zu versehen. Die Größe und die Position des Site-Logos sind von dem Kopfzeilen-Style abhängig, den Sie auswählen (Standard, Auffällig oder Benutzerdefiniertes HTML/CSS).
Führen Sie die folgenden Schritte aus, um ein Logo zur Kopfzeile hinzuzufügen:
- Öffnen Sie eine Site im Bearbeitungsmodus.
- Klicken Sie im Fenster Anpassen auf Kopfzeile.
Tipp:
Wenn das Fenster Anpassen nicht angezeigt wird, klicken Sie auf die Umschaltfläche
, um es zu öffnen. - Klicken Sie im Menü Aussehen auf die Umschaltfläche Logo, um das Logo zu aktivieren.
- Wählen Sie eine der folgenden Optionen aus:
- Um eine Bild-URL anzugeben, wählen Sie Bild-URL aus, und fügen Sie einen unterstützten Link zu einem Bild im Feld URL ein.
Zu den unterstützten Dateitypen zählen .jpeg, .png und .gif.
- Wählen Sie zum Hochladen einer Datei die Option Hochladen aus.
Die maximale Dateigröße liegt bei 3 MB, und nur die Dateitypen .jpeg, .jpg und .png sind zulässig.
Tipp:
Das beste Ergebnis erhalten Sie mit einem Bild im .png-Format.
Wenn Sie Hochladen ausgewählt haben, führen Sie die folgenden Schritte aus, um ein Bild hochzuladen:
- Ziehen Sie die Datei auf das Feld, oder klicken Sie auf Bild suchen, um das Bild hinzuzufügen.
- Klicken Sie auf die Schaltfläche Bild zuschneiden
, um das Bild zuzuschneiden oder seine Größe anzupassen.Um das Bild zuzuschneiden, ziehen Sie einen Ziehpunkt, um die Größe des Zuschneiderahmens zu ändern. Um den Zuschneiderahmen neu zu positionieren, klicken Sie auf die gepunktete Linie, und ziehen Sie sie. Um den Zoom anzupassen, verwenden Sie den Schieberegler unter dem Bild.
- Klicken Sie auf Fertig, um die Änderungen anzuwenden.
Das Logo wird der Kopfzeile hinzugefügt, und seine Größe wird auf der Grundlage des ausgewählten Layouts und der ausgewählten Logoausrichtung angepasst.
- Um eine Bild-URL anzugeben, wählen Sie Bild-URL aus, und fügen Sie einen unterstützten Link zu einem Bild im Feld URL ein.
- Bei Verwendung des Kopfzeilen-Styles Auffällig haben Sie die Möglichkeit, eine Einstellung für die Logoausrichtung auszuwählen.
- Horizontales Logo: Das Logo behält die Standardhöhe von 60 Pixeln. Es wird am Namen oder Kurznamen der Kopfzeile ausgerichtet.
- Vertikales Logo: Das Logo wird mit einer Höhe von 130 Pixeln eingeblendet. Es wird links von allen Inhalten der Kopfzeile, einschließlich Namen und Menü-Links, platziert.
- Geben Sie unter Alternativer Text für das Logo Text an, um die Barrierefreiheitsstandards zu erfüllen.
Tipp:
Sofern ein Logo Text umfasst, kann als alternativer Text der Name des Unternehmens verwendet werden. Handelt es sich bei dem Logo um ein Symbol, wird der alternative Text nicht benötigt, sodass Sie "" eingeben können.
- Klicken Sie auf Layout speichern.
Hinzufügen von Social-Media-Links zur Kopfzeile
Fügen Sie Social-Media-Symbole zur Kopfzeile hinzu, die zu Ihren Konten bei Facebook, X, Instagram oder YouTube verlinken. Führen Sie die folgenden Schritte aus, um Social-Media-Links zur Kopfzeile hinzuzufügen:
Hinweis:
Wenn Sie den Kopfzeilen-Style Benutzerdefiniertes HTML/CSS verwenden, ist es nicht möglich, die Social-Media-Links mit den folgenden Schritten zu konfigurieren.
- Öffnen Sie eine Site im Bearbeitungsmodus.
- Klicken Sie im Fenster Anpassen auf Kopfzeile.
Tipp:
Wenn das Fenster Anpassen nicht angezeigt wird, klicken Sie auf die Umschaltfläche
, um es zu öffnen. - Blenden Sie Social-Media-Symbole ein.
- Klicken Sie auf die Umschaltflächen, um Social-Media-Symbole hinzuzufügen.
Die Social-Media-Symbole werden in der Kopfzeile angezeigt.
- Geben Sie URLs Ihrer Social-Media-Konten an, um diese mit den Symbolen zu verlinken.
- Klicken Sie auf Layout speichern.
Erstellen eines Designs
Erstellen Sie ein Design für die Site, indem Sie Farben für deren Kopfzeile und Text auswählen. Die Farben, die Sie im Menü Design auswählen, werden auf die gesamte Site angewendet. Sie können diese Auswahl außer Kraft setzen, indem Sie Farben für bestimmte Zeilen konfigurieren. Weitere Informationen finden Sie unter Anpassen einer Site.
Tipp:
Beachten Sie bei der Farbauswahl die Branding-Richtlinien der Organisation. Viele Branding-Richtlinien enthalten Farbcodes für Inhalte wie Websites und Logos. Falls es keine Branding-Richtlinien gibt, beraten Sie sich mit dem Team oder den Projektbeteiligten, um sicherzustellen, dass das Design der Site der Organisation entspricht.
Führen Sie die folgenden Schritte aus, um ein Design zu erstellen:
- Öffnen Sie eine Site im Bearbeitungsmodus.
- Klicken Sie im Fenster Anpassen auf Design.
Tipp:
Wenn das Fenster Anpassen nicht angezeigt wird, klicken Sie auf die Umschaltfläche
, um es zu öffnen. - Wählen Sie eine Farbe für eine oder alle der folgenden Optionen aus, indem Sie einen Hexadezimalwert als Farbcode eingeben oder eine Farbe aus der Farbauswahl auswählen.
- Hintergrundfarbe für globale Navigation: Wendet eine Farbe auf die globale Navigationsleiste der Site an.
- Textfarbe für globale Navigation: Wendet eine Farbe für den Text und die Schaltflächen in der globalen Navigationsleiste an.
- Hintergrundfarbe der Kopfzeile: Wendet eine Farbe auf die Kopfzeile der Site an.
- Textfarbe der Kopfzeile: Wendet eine Farbe auf den gesamten Text in der Kopfzeile der Site an.
- Texthintergrundfarbe: Wendet eine Farbe auf die Zeilen der Site an. Die Hintergrundfarbe kann auch für einzelne Zeilen konfiguriert werden.
- Textfarbe: Wendet eine Farbe auf den gesamten Text auf der Site an. Die Textfarbe kann auch für einzelne Zeilen konfiguriert werden.
- Link-Farbe des Textes: Wendet eine Farbe für Links auf der Website an.
Hinweis:
Im Aktionsmenü einer veröffentlichten Hub-Site wird der Wert Link-Farbe des Textes für die Hintergrundfüllung und der Wert Texthintergrundfarbe für Symbole oder Text verwendet.
- Optional können Sie Schriftarten auf Text in der Kopfzeile und im Text der Site anwenden, indem Sie wie folgt vorgehen:
- Klicken Sie auf die Schaltfläche zum Anpassen der Basisschriftart oder der Schriftart für Überschriften.
Die Basisschriftart wird für Text im Textkörper der Site verwendet, und die Schriftart für Überschriften wird für Text in der Kopfzeile der Site verwendet.
Tipp:
Wenn Sie die Basisschriftart und die Schriftart für Überschriften so anpassen möchten, dass sie derselben Schriftfamilie angehören, aktualisieren Sie zunächst die Basisschriftart, und aktivieren Sie dann das Kontrollkästchen Dieselbe Schriftart als Basisschrift verwenden für die Schriftart für Überschriften.
- Fügen Sie unter URL für @import die @import-URL aus dem eingebetteten Code der Schriftart ein.
- Geben Sie den Namen der Schriftfamilie ein.
- Klicken Sie optional auf Vorschau der Schriftart anzeigen, um den Vorschautext mit der importierten Schriftfamilie anzuzeigen.
- Klicken Sie bei Bedarf auf die Registerkarte, um die zweite Schriftart zu aktualisieren.
- Klicken Sie auf Übernehmen.
- Klicken Sie auf die Schaltfläche zum Anpassen der Basisschriftart oder der Schriftart für Überschriften.
- Klicken Sie auf Layout speichern.
Hinweis:
Wenn Sie die Standardschriftarten wiederherstellen möchten, klicken Sie im unteren Bereich des Menüs Design auf Schriftarten zurücksetzen.
Erstellen einer Fußzeile
Eine Site-Fußzeile kann mit benutzerdefiniertem HTML und CSS hinzugefügt werden. Die Fußzeile wird am unteren Rand der Site und auf allen an der Site angehängten Seiten und Ansichten angezeigt. Führen Sie die folgenden Schritte aus, um eine Fußzeile zur Site hinzuzufügen:
- Öffnen Sie eine Site im Bearbeitungsmodus.
- Klicken Sie im Bereich Anpassen auf die Option Fußzeile.
Tipp:
Wenn das Fenster Anpassen nicht angezeigt wird, klicken Sie auf die Umschaltfläche
, um es zu öffnen. - Klicken Sie auf die Option Benutzerdefiniert.
- Klicken Sie auf HTML-Code-Editor öffnen oder CSS-Code-Editor öffnen , um den Code für die benutzerdefinierte Fußzeile zu schreiben.
- Klicken Sie auf Übernehmen, um die Änderungen an der Fußzeile anzuzeigen.
Hinweis:
Fußzeilen-HTML bietet keine Unterstützung für eingebettetes JavaScript. Skript-Tags werden ignoriert.
- Klicken Sie auf Layout speichern.