Kopfzeile Ihrer Cloudbeds Website konfigurieren

Gabriela Garcia

Aktualisiert 23. Oktober 2026 11:32

Zweck	Wählen und konfigurieren Sie, wie sich die Kopfzeile Ihrer Cloudbeds-Website verhält, während Besucher die Seite durchscrollen.
Am besten geeignet für	Manager/General Manager und Administratoren, die das Layout und die Navigation einer Cloudbeds-Website verwalten.
Anwendung	Wenn Sie die Kopfzeile der Website statisch, fixiert, schrumpfend, überlappend oder ausgeblendet gestalten möchten.
Voraussetzungen	Eine Cloudbeds-Website, die Sie im Cloudbeds-Websites-Editor bearbeiten können.
Erwartetes Ergebnis	Die Kopfzeile Ihrer Website verwendet die von Ihnen ausgewählten Verhaltens- und Design-Einstellungen.

Einführung

Die Kopfzeile ist der obere Bereich einer Webseite und erscheint normalerweise auf der gesamten Seite. Sie kann wichtige Informationen wie Ihr Logo und Kontaktdaten enthalten sowie Navigationselemente, die Besuchern helfen, sich zurechtzufinden und zu anderen Bereichen der Website zu gelangen.

Im Cloudbeds-Websites-Editor können Sie konfigurieren, wie sich die Kopfzeile verhält, wenn Besucher scrollen oder mit der Seite interagieren. Beginnen Sie damit, den Kopfzeilentyp auszuwählen, der dem gewünschten Verhalten entspricht, und wenden Sie dann die Einstellungen im Design-Panel an.

Inhaltsverzeichnis

Wähle einen Kopfzeilentyp aus
Greifen Sie auf die Design-Einstellungen der Kopfzeile zu
Konfigurieren Sie eine statische Kopfzeile
Konfigurieren Sie eine fixe Kopfzeile
Konfigurieren Sie eine schrumpfende Kopfzeile
Konfigurieren Sie eine überlappende Kopfzeile
Konfigurieren Sie eine versteckte Kopfzeile

Wähle einen Kopfzeilentyp aus

Kopfzeilentypen bestimmen, was Besucher oben auf der Seite sehen und wie sich die Kopfzeile beim Scrollen verhält. Verwenden Sie die untenstehenden Beschreibungen, um das gewünschte Verhalten auszuwählen, bevor Sie die Kopfzeileneinstellungen ändern.

Kopfzeilentyp	Funktion
Statisch	Erscheint oben auf der Seite und verschwindet beim Scrollen aus dem Sichtfeld.
Fixiert	Bleibt beim Scrollen oben auf der Seite fixiert.
Schrumpfend	Bleibt beim Scrollen fixiert und wechselt zu einer kompakteren Kopfzeile.
Überlappend	Überlappt den ersten Abschnitt der Seite für ein integrierteres visuelles Design.
Versteckt	Ist standardmäßig versteckt und erscheint nur, wenn eine unterstützte Benutzeraktion ausgelöst wird. Die Hamburger-Menütaste ist nur bei Tablet- und Mobilgeräten verfügbar.

Greifen Sie auf die Design-Einstellungen der Kopfzeile zu

Das Verhalten der Kopfzeile wird im Design-Panel konfiguriert, nachdem Sie die Kopfzeile im Cloudbeds Websites Editor ausgewählt haben.

Öffnen Sie Ihre Cloudbeds-Website im Cloudbeds Websites Editor.
Wählen Sie die Kopfzeile aus.
Verwenden Sie das Design-Panel, um die verfügbaren Einstellungen für die Kopfzeile zu öffnen.

Nachdem Sie die Kopfzeile ausgewählt haben, verwenden Sie das Design-Panel, um auf die verfügbaren Kopfzeileneinstellungen zuzugreifen. In diesem Beispiel sind die Steuerungen für die Kopfzeilenüberlappung sichtbar.

Statische Kopfzeile konfigurieren

Eine statische Kopfzeile erscheint oben auf der Seite, bleibt jedoch beim Scrollen nicht sichtbar. Verwenden Sie diese Konfiguration, wenn die Kopfzeile den ersten Abschnitt nicht überlappen oder beim Scrollen fixiert bleiben soll.

Wählen Sie die Kopfzeile aus.
Erweitern Sie im Design-Panel Position.
Stellen Sie sicher, dass Überlappung mit dem oberen Abschnitt auf der Seite deaktiviert ist.
Stellen Sie sicher, dass Als fixe Kopfzeile festlegen deaktiviert ist.

Eine fixe Kopfzeile bleibt beim Scrollen oben auf der Seite fixiert.

Wählen Sie die Kopfzeile aus.
Erweitern Sie im Design-Panel Position.
Aktivieren Sie Als fixe Kopfzeile festlegen.

Schrumpfende Kopfzeile konfigurieren

Eine schrumpfende Kopfzeile, auch bekannt als dynamische fixe Kopfzeile, bleibt beim Scrollen oben auf der Seite fixiert und wechselt zu einem kompakteren Design. Konfigurieren Sie sowohl das Anfangsdesign als auch die Änderung beim Scrollen.

Wählen Sie die Kopfzeile aus.
Erweitern Sie im Design-Panel Position.
Aktivieren Sie Als fixe Kopfzeile festlegen.
Aktivieren Sie Kopfzeile beim Scrollen ändern.
Erweitern Sie in den Kopfzeileneinstellungen Abstände und legen Sie die Anfangswerte für Padding oben und Padding unten fest.
Kehren Sie zu Position zurück und konfigurieren Sie das Scroll-Verhalten:
- Hintergrund beim Scrollen: Wählen Sie die Hintergrundfarbe und die Deckkraft aus.
- Abstände beim Scrollen: Legen Sie die Werte für Padding oben und Padding unten fest, die kleiner als die Anfangsabstände der Kopfzeile sein sollen.
- Logo-Größe: Verwenden Sie den Schieberegler oder das Textfeld, um die Größe festzulegen, auf die das Logo beim Scrollen schrumpft. Der Standardwert beträgt 66 %.

Die Einstellungen zum Scroll-Verhalten umfassen die Steuerungen für eine schrumpfende Kopfzeile, einschließlich fixiertem Verhalten, Änderungen beim Scrollen, Abständen und Logo-Größe.

Einen überlappenden Kopfzeilenbereich konfigurieren

Ein überlappender Kopfzeilenbereich verschmilzt optisch mit dem ersten Abschnitt der Seite, indem die Kopfzeile über diesem Abschnitt platziert wird.

Wählen Sie den Kopfzeilenbereich aus.
Erweitern Sie im Design-Panel Position.
Aktivieren Sie Überlappung mit dem oberen Abschnitt auf der Seite.
Wählen Sie die Hintergrundfarbe und die Deckkraft der Kopfzeilenüberlappung aus.

Einen versteckten Kopfzeilenbereich konfigurieren

Ein versteckter Kopfzeilenbereich ist standardmäßig nicht sichtbar und erscheint nur, wenn er durch eine Benutzeraktion ausgelöst wird, beispielsweise durch Auswahl des Hamburger-Menü-Buttons. Wählen Sie die Kopfzeilen-Voreinstellung im Design-Panel aus.

Wählen Sie den Kopfzeilenbereich aus.
Erweitern Sie im Design-Panel Voreinstellungen.
Wählen Sie das Voreinstellungs-Layout, das zu Ihrem Design passt.

Der Hamburger-Menü-Button ist nur bei Tablet- und Mobilgeräte-Layouts verfügbar.

Da Sie nun das Verhalten der Kopfzeile für Ihre Cloudbeds-Website auswählen und konfigurieren können, nutzen Sie diese Ressourcen für eine umfassendere Navigation im Editor 2.0, globale Gestaltung der Website und Orientierung im Website-Management: