Hinzufügen eines Branding zu einer Site mit Kopfzeile und Designoptionen

Sie können eine Site anpassen, indem Sie eine Kopfzeile entwerfen, ein Design erstellen oder eine Fußzeile hinzufügen.

Anpassen der Kopfzeile

Jede Site hat eine Kopfzeile, die oben auf der Site (unter der globalen Navigationsleiste) und auf allen Seiten und Ansichten, die der Site angefügt sind, angezeigt wird. Die Kopfzeile enthält Titel, Logo und Menü-Links der Site. Sie können die Kopfzeile nicht entfernen, aber ihr Design ändern.

1. Öffnen Sie eine Site im Bearbeitungsmodus.
2. Öffnen Sie den Seitenbereich durch Auswählen der Umschaltfläche . Wählen Sie Kopfzeile aus (mit Anpassen können Sie zum Menü Anpassen zurückkehren).
3. 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 (120 Pixel) und zusätzliche Menü-Links.
   • Benutzerdefiniertes HTML/CSS: Verwenden Sie einen syntaxfähigen Code-Editor, um eine Kopfzeile mit benutzerdefiniertem Code zu konfigurieren.

     Hinweis:

     Benutzerdefinierte Kopfzeilen werden auf allen Seiten der Site angezeigt, nicht aber in Inhaltsansichten. Weitere Informationen finden Sie unter Why does the Explore content view branding look different?

4. Wählen Sie für Layout die Option Box oder Breit aus.
5. Name: Geben Sie einen Namen ein, der in der Kopfzeile der Site angezeigt werden soll. Der Name, den Sie in diesem Feld angeben, wird nur in der Kopfzeile angezeigt und nicht in die URL der Site oder in die Liste der Sites übernommen.
6. Kurzname: Geben Sie eine kurze Version des Titels ein, den Sie der Kopfzeile hinzugefügt haben. Der Kurzname wird nur für die Kopfzeile verwendet, wenn sie zu lang ist, um auf einem kleinen Bildschirm, z. B. auf einem Mobiltelefon, angezeigt zu werden.

   Hinweis:

   Fügen Sie einen Kurznamen hinzu, um die Qualität der Site auf allen beliebigen Geräten zu gewährleisten.

7. Wenn Sie die Kopfzeile der Site mit einem Branding mit benutzerdefinierten HTML- oder CSS-Inhalten versehen möchten, wählen Sie Benutzerdefiniertes HTML/CSS aus, und geben Sie den Code in den HTML- und CSS-Feldern an.

   Hinweis:

   Kopfzeilen-HTML bietet keine Unterstützung für eingebettetes JavaScript. Skript-Tags werden ignoriert.

8. Wählen Sie Speichern aus.

Erstellen eines Designs

Entwerfen Sie ein Design für Ihre Site, indem Sie Farben für Kopf, Text und Schaltflächen Ihrer Site auswählen. Die Farben, die Sie im Menü Design Ihrer Site 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 Farben und Schriftarten.

Tipp:

Beachten Sie bei der Farbauswahl die Markenrichtlinien der Organisation. Viele Markenrichtlinien enthalten genaue Farbcodes für Content wie Websites und Logos. Falls es keine Markenrichtlinien gibt, beraten Sie sich mit dem Team oder den Projektbeteiligten, um sicherzustellen, dass das Design der Site der Organisation entspricht.

1. Öffnen Sie eine Site im Bearbeitungsmodus.
2. Wählen Sie im Fenster Anpassen die Option Design aus.
3. Wenn Sie eine der folgenden Optionen mit einer Farbe versehen möchten, geben Sie einen Farbcode als Hexadezimalwert ein, oder wählen Sie über die Farbauswahl, die sich neben dem Feld für den Farbcode befindet, eine Farbe aus.
   • Mit der Option Hintergrundfarbe für globale Navigation können Sie die globale Navigationsleiste der Site mit einer Farbe versehen.
   • Mit der Option Textfarbe für globale Navigation können Sie den Text in der globalen Navigationsleiste mit einer Farbe versehen.

     Hinweis:

     Weitere Informationen finden Sie unter Was ist globale Navigation?

   • Mit der Option Hintergrundfarbe der Kopfzeile können Sie die Kopfzeile der Site mit einer Farbe versehen.
   • Mit der Option Textfarbe der Kopfzeile können Sie den gesamten Kopfzeilentext mit einer Farbe versehen.
   • Mit der Option Texthintergrundfarbe können Sie die Zeilen der Site mit einer Farbe versehen. Die Zeilen- und Textfarben können ebenfalls für jede Zeile konfiguriert werden, indem Sie die Schritte unter Farben und Schriftarten ausführen.
   • Mit der Option Textfarbe können Sie den Text auf Ihrer Site mit einer Farbe versehen.
   • Mit der Option Link-Farbe des Textes können Sie auf der Site bereitgestellte Links mit einer Farbe versehen.

     Hinweis:

     Für Schaltflächen werden die Link-Farbe des Textes und die Texthintergrundfarbe verwendet, um sicherzustellen, dass Schaltflächen für alle Benutzer barrierefrei sind. Nähere Informationen finden Sie im Community-Beitrag Update to Hub button theme colors. Für vertikale Registerkarten, einschließlich der Schaltfläche für die Freigabe, wird Link-Farbe des Textes für die Hintergrundfüllung und Texthintergrundfarbe für Symbole oder Text verwendet.

4. Wenn Sie alle Farben festgelegt haben, wählen Sie Speichern aus.
5. Sie können auch die Schriftarten der Kopfzeile und des Textes der Site ändern.
   • Wenn Sie eine Schriftart für den Text der Site auswählen möchten, wählen Sie die Schaltfläche Basisschriftart aus.
   • Wenn Sie die Schriftart der Kopfzeile ändern möchten, wählen Sie die Schaltfläche Schriftart für Überschriften aus.

Hinweis:

Wenn Sie von Neuem beginnen oder die Standardfarben wiederherstellen möchten, wählen Sie im unteren Bereich des Menüs Design die Option Schriftarten zurücksetzen aus.

Hinzufügen eines Logos zu einer Kopfzeile

Die Größe und die Position des Site-Logos sind von dem Kopfzeilen-Style abhängig, den Sie auswählen.

1. Öffnen Sie eine Site im Bearbeitungsmodus.
2. Wählen Sie im Bereich Anpassen die Option Kopfzeile aus.
3. Wählen Sie im Menü Aussehen die Umschaltfläche Logo aus, um das Logo zu aktivieren.
4. Fügen Sie mit Bild-URL oder Hochladen ein Bild hinzu.

   Tipp:

   Wenn Sie ein Bild aus einer Datei hochladen, hat sich die Verwendung eines Bildes im PNG-Format bewährt. Schneiden Sie das Bild zu, und passen Sie die Größe an, falls erforderlich.

5. Bei Verwendung der Kopfzeile Auffällig haben Sie die Möglichkeit, eine Einstellung für die Logoausrichtung auszuwählen.
6. 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.

7. Wählen Sie Speichern aus.

Hinzufügen von Social-Media-Links zu einer Kopfzeile

Sie können der Kopfzeile Social-Media-Symbole als Links zu Ihren Konten bei Facebook, Twitter, Instagram oder YouTube hinzufügen.

1. Öffnen Sie eine Site im Bearbeitungsmodus.
2. Wählen Sie im Bereich Anpassen die Option Kopfzeile aus.
3. Blenden Sie Social-Media-Symbole ein.
4. Aktivieren Sie die Anzeige der Social-Media-Plattformen in der Kopfzeile, und geben Sie eine URL zum Konto Ihrer Plattform an.
5. Wählen Sie Speichern aus.

Erstellen einer Fußzeile

Sie können benutzerdefinierten HTML-Code verwenden, um Ihrer Site eine Fußzeile hinzuzufügen, die auf allen Seiten angezeigt wird, die an Ihre Site angehängt sind.

1. Öffnen Sie eine Site im Bearbeitungsmodus.
2. Wählen Sie im Bereich Anpassen die Option Fußzeile aus.
3. Wählen Sie die Umschaltfläche neben Benutzerdefiniert aus.
4. Ändern Sie das CSS- und HTML-Feld im Seitenbereich, und wählen Sie Speichern aus, um die Auswirkungen auf den HTML-Code zu sehen.

   Hinweis:

   Fußzeilen-HTML bietet keine Unterstützung für eingebettetes JavaScript. Skript-Tags werden ignoriert.

Verwandte Inhalte

Wenn Sie das Branding der Site noch erweitern möchten, haben Sie folgende Möglichkeiten:

• Fügen Sie Menülinks hinzu, und stellen Sie sicher, dass die globale Navigation aktiviert ist. Weitere Informationen finden Sie unter Konfigurieren der globalen Navigation und der Menü-Links.