--- title: Header url: "https://www.toujou.de/service/elementbibliothek/header/" date: 2025-12-19 modified: 2026-01-16 --- # Header 1. [Home](https://www.toujou.de/) 2. [Service](https://www.toujou.de/service/) 3. [Elementbibliothek](https://www.toujou.de/service/elementbibliothek/) 4. [Header](https://www.toujou.de/service/elementbibliothek/header/) **Die toujou-Elementbibliothek** -------------------------------- Header-Elemente =============== In toujou finden Sie vorkonfigurierte Elemente für den Header-Bereich Ihrer Website. Das Erscheinungsbild wird zentral gesteuert und inklusive responsivem Verhalten angeboten. Darstellung, Links und Verhalten werden durch den Redakteur gesteuert. Dabei gibt es Header-Elemente, die in allen Endgeräten in ein und das selbe Format ausgegeben werden und Elemente mit mehr Gestaltungsmöglichkeiten. **Header-Elemente**: [Headercontent Element](#c1019342) | [Header Media 3:1](#c1019341) | [Headercontent Slider](#c1019340) | [Headercontent Slider 3:1](#c1019339) | ### Gebrauchsanweisung Auf dieser Seite finden Sie alle in toujou verfügbaren Header-Elemente. Um nicht mit echten Inhalten verwechselt zu werden, verwenden wir in der Bibliothek Blindtext. Zur detaillierten Nutzungsanleitung gelangen Sie über die rechts unter dem jeweiligen Element platzierten [Schaltflächen ❯](https://www.toujou.de/service/elementbibliothek/header/) --- Alle Header-Elemente im Überblick ----------------------------------- ### Headercontent Element [ ![](https://www.toujou.de/_assets/processed/9Or_-OFdCeZZPKNoPDUXwM7lbkCBc2zRbgw5PgyFGt0/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8xMDBfMDFfd2lkZXNjcmVlbl8xMDI4Nzg2OGUw:t/cb:4e51770aa30ed837de6e0b1cc4ca84c69bbd5b13/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzEwMF8wMV93aWRlc2NyZWVuLnBuZw) Ansicht für Endgeräte mit mehr als 1440 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_100_01_widescreen.png) #### **Widescreen** [ ![](https://www.toujou.de/_assets/processed/Qt50UuoypCxgYP1InkQUVuXUdxOhYtWCepGvAzU0UcM/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8xMDBfMDJfZGVza3RvcF8yZGEyZTA2YzY4:t/cb:9151149686bc4ebeedf12c6027a6b58be2ef92ef/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzEwMF8wMl9kZXNrdG9wLnBuZw) Ansicht für Endgeräte mit mehr als 1024 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_100_02_desktop.png) #### **Desktop** [ ![](https://www.toujou.de/_assets/processed/Ci8XeSfY9Mz5rGHwacjC8B68bGd9tuyJ3OeaHepmuFs/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8xMDBfMDNfdGFibGV0Xzk5MGUxZThhNmM:t/cb:9cb66c501b7a032d18828af6e142dc23ada05f56/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzEwMF8wM190YWJsZXQucG5n) Ansicht für Endgeräte mit mehr als 600 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_100_03_tablet.png) #### **Tablet** [ ![](https://www.toujou.de/_assets/processed/NDWLWw6wKTO97iQUPB58qX1n2Gy9Yzy0fTcTIc4CnIQ/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8xMDBfbW9iaWxlXzk2Y2MwYmRkMjk:t/cb:71fd73f34d2528b6e68671b15ca0d0d1e5029dae/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzEwMF9tb2JpbGUucG5n) Ansicht exemplarisch mit 375 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_100_mobile.png) #### **Mobile** [Headercontent Element >](https://www.toujou.de/service/elementbibliothek/header/headercontent-element/) --- ### Header Media 3:1 [ ![](https://www.toujou.de/_assets/processed/rqEz28et-eeO2MS4B2TOLdoI_s2qGsVNlLJjnzb9bVU/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8zLTFfMDFfd2lkZXNjcmVlbl8wMV84YzVjNGE1NjY0:t/cb:7a8ccdcf7550ffa13506278b0d6dca3a882432f5/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzMtMV8wMV93aWRlc2NyZWVuXzAxLnBuZw) Ansicht für Endgeräte mit mehr als 1440 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_3-1_01_widescreen_01.png) #### **Widescreen** [ ![](https://www.toujou.de/_assets/processed/sToyNoAYfFZzOXMl2kbbdq4_OfsMwblQU_8N-AHIWRQ/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8zLTFfMDJfZGVza3RvcF8wMV9kOGY3YTRmNTcw:t/cb:cf11e2c1dd6903a060e0677edb2f44d6ab858062/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzMtMV8wMl9kZXNrdG9wXzAxLnBuZw) Ansicht für Endgeräte mit mehr als 1024 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_3-1_02_desktop_01.png) #### **Desktop** [ ![](https://www.toujou.de/_assets/processed/93m82QIdiCPe-48YB8nXAF4YOmis5KK2hs4yqk49VC8/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8zLTFfMDNfdGFibGV0XzcyN2JhZmQ1Y2Y:t/cb:0abb494744a57e8053ca0b0d285da55526be4c61/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzMtMV8wM190YWJsZXQucG5n) Ansicht für Endgeräte mit mehr als 600 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_3-1_03_tablet.png) #### **Tablet** [ ![](https://www.toujou.de/_assets/processed/dCbtxzEAYDr6_CDO689A7oG_tBeITkh0gsTS5ou8ZhU/q:85/w:432/h:281/fn:Y3NtX0hlYWRlcl8zLTFfMDRfbW9iaWxlX2EwNWQ1MjlhYmE:t/cb:50d754f02d462b2f9b0c54986c930b65b39332e2/bG9jYWw6L2ZpbGVhZG1pbi90b3Vqb3UvZWxlbWVudF9saWJyYXJ5LzA3X1dpZGdldHMvMDFfSGVhZGVyY29udGVudC9oZWFkZXItZWxlbWVudF9iZXNjaHJlaWJ1bmcvYW5zaWNodF9lbmRnZXJhZXRlL29obmVfaGVhZGxpbmUvSGVhZGVyXzMtMV8wNF9tb2JpbGUucG5n) Ansicht exemplarisch mit 375 px Breite ](https://www.toujou.de/fileadmin/toujou/element_library/07_Widgets/01_Headercontent/header-element_beschreibung/ansicht_endgeraete/ohne_headline/Header_3-1_04_mobile.png) #### **Mobile** [Header Media 3:1 >](https://www.toujou.de/service/elementbibliothek/header/header-media-31-ratio/) --- ### Headercontent Slider - ![Eine stilisierte Szene zeigt einen Mann, der ein Smartphone hält, umgeben von Symbolen für Musik, Bilder und Karten.](https://www.toujou.de/_assets/processed/bDQhAo83U2Bqw9oijmMhrnqg2TXZyLn5_Ia0FkY2cxI/q:85/w:700/h:292/fn:Y3NtXzAxX2NvbXBvc2UtY29udGVudF9jOTQyY2MwNTI4:t/cb:ff3034d2a0288e401cb7c6e761cfccc79db22230/bG9jYWw6L2ZpbGVhZG1pbi9JbWFnZXMvaGVhZGVyLzE5MjB4ODAwLzAxX2NvbXBvc2UtY29udGVudC5wbmc) ### Headercontent Slider You can style and position the content according to your needs. [Beautiful button](https://www.toujou.de/service/elementbibliothek/header/) - ![Eine Gruppe von Menschen steht in einem modernen Büro, umgeben von Pflanzen und Computern, während sie miteinander sprechen.](https://www.toujou.de/_assets/processed/gvleCCmte9-ReBwmsuDR4K1F6JW9deKx5ogUTLdQNJk/q:85/w:700/h:292/fn:Y3NtXzE5MjB4ODAwX1dlYi1oZWFkZXJfb2ZmaWNlLXBlb3BsZV9iYjMzMzA0ODY5:t/cb:5554be7332ef37eab8411ee2c8fd1013f2499f23/bG9jYWw6L2ZpbGVhZG1pbi9JbWFnZXMvaGVhZGVyLzE5MjB4ODAwLzE5MjB4ODAwX1dlYi1oZWFkZXJfb2ZmaWNlLXBlb3BsZS5wbmc) ### Second Headline You can style and position the content according to your needs. [Beautiful button](https://www.toujou.de/service/elementbibliothek/header/) - ![Eine Gruppe von Menschen sitzt in einem Raum, während ein Referent eine Präsentation an einer Wand zeigt.](https://www.toujou.de/_assets/processed/p5mqjcCR9qZJUsl7vbi7bYQyIsFKxtHtNbjEGl6SXIY/q:85/w:700/h:292/fn:Y3NtXzE5MjB4ODAwX1dvcmtzaG9wX2JsdWVfZTM3ZGM5MmUwMA:t/cb:d5e517da43c43f956570a9b4763d0d83636badbb/bG9jYWw6L2ZpbGVhZG1pbi9JbWFnZXMvaGVhZGVyLzE5MjB4ODAwLzE5MjB4ODAwX1dvcmtzaG9wX2JsdWUucG5n) ### Third Headline You can style and position the content according to your needs. [Beautiful button](https://www.toujou.de/service/elementbibliothek/header/) von [Headercontent Slider >](https://www.toujou.de/service/elementbibliothek/header/headercontent-slider/) --- ### Headercontent Slider 3:1 - ![Eine stilisierte Szene zeigt einen Mann, der ein Smartphone hält, umgeben von Symbolen für Musik, Bilder und Karten.](https://www.toujou.de/_assets/processed/bDQhAo83U2Bqw9oijmMhrnqg2TXZyLn5_Ia0FkY2cxI/q:85/w:700/h:292/fn:Y3NtXzAxX2NvbXBvc2UtY29udGVudF9jOTQyY2MwNTI4:t/cb:ff3034d2a0288e401cb7c6e761cfccc79db22230/bG9jYWw6L2ZpbGVhZG1pbi9JbWFnZXMvaGVhZGVyLzE5MjB4ODAwLzAxX2NvbXBvc2UtY29udGVudC5wbmc) ### Headercontent Slider (3:1 ratio) You can style and position the content according to your needs. [Beautiful button](https://www.toujou.de/service/elementbibliothek/header/) - ![Eine Gruppe von Menschen steht in einem modernen Büro, umgeben von Pflanzen und Computern, während sie miteinander sprechen.](https://www.toujou.de/_assets/processed/gvleCCmte9-ReBwmsuDR4K1F6JW9deKx5ogUTLdQNJk/q:85/w:700/h:292/fn:Y3NtXzE5MjB4ODAwX1dlYi1oZWFkZXJfb2ZmaWNlLXBlb3BsZV9iYjMzMzA0ODY5:t/cb:5554be7332ef37eab8411ee2c8fd1013f2499f23/bG9jYWw6L2ZpbGVhZG1pbi9JbWFnZXMvaGVhZGVyLzE5MjB4ODAwLzE5MjB4ODAwX1dlYi1oZWFkZXJfb2ZmaWNlLXBlb3BsZS5wbmc) ### Second Headline You can style and position the content according to your needs. [Beautiful button](https://www.toujou.de/service/elementbibliothek/header/) - ![Eine Gruppe von Menschen sitzt in einem Raum, während ein Referent eine Präsentation an einer Wand zeigt.](https://www.toujou.de/_assets/processed/p5mqjcCR9qZJUsl7vbi7bYQyIsFKxtHtNbjEGl6SXIY/q:85/w:700/h:292/fn:Y3NtXzE5MjB4ODAwX1dvcmtzaG9wX2JsdWVfZTM3ZGM5MmUwMA:t/cb:d5e517da43c43f956570a9b4763d0d83636badbb/bG9jYWw6L2ZpbGVhZG1pbi9JbWFnZXMvaGVhZGVyLzE5MjB4ODAwLzE5MjB4ODAwX1dvcmtzaG9wX2JsdWUucG5n) ### Third Headline You can style and position the content according to your needs. [Beautiful button](https://www.toujou.de/service/elementbibliothek/header/) von [Headercontent Slider 3:1 >](https://www.toujou.de/service/elementbibliothek/header/headercontent-slider-31-ratio/) ##### toujou-Tutorials [Checkliste ❯](https://www.toujou.de/service/#c1001893) [Kontakt/Daten hinterlegen ❯ ](https://www.toujou.de/tutorials/kontakte-anlegen/) [Dateiliste / Fileadmin ❯ ](https://www.toujou.de/tutorials/dateiliste/) [Navigation bearbeiten ❯ ](https://www.toujou.de/tutorials/seiten-anlegen/) [Seiteninhalte ❯](https://www.toujou.de/tutorials/seiteninhalte/) [Seiteneigenschaften ❯](https://www.toujou.de/tutorials/seiteneigenschaften/) [Responsive-Check ❯](https://www.toujou.de/tutorials/responsive-mobile-first/) [Yoast SEO ❯](https://www.toujou.de/tutorials/yoast-seo/) [Redirects ❯](https://www.toujou.de/tutorials/redirects/) / [Blog ❯](https://www.toujou.de/tutorials/blog-administration/) [Seiten übersetzen ❯](https://www.toujou.de/tutorials/seiten-uebersetzen/) [Linkvalidator ❯](https://www.toujou.de/tutorials/linkvalidator/) ##### toujou-Setup [Theme ❯ ](https://www.toujou.de/service/toujou-setup/theme-bearbeiten/) [Logo ❯ ](https://www.toujou.de/service/toujou-setup/logo-hochladen/) [Font ❯ ](https://www.toujou.de/service/toujou-setup/font-bestimmen/) [Color ❯ ](https://www.toujou.de/service/toujou-setup/farben-festlegen/) [Social Media ❯ ](https://www.toujou.de/service/toujou-setup/social-media/) [Analytics ❯](https://www.toujou.de/service/toujou-setup/analytics/) [Data Protection ❯](https://www.toujou.de/service/toujou-setup/datenschutz/) [Website Overlay ❯](https://www.toujou.de/service/toujou-setup/website-overlay/) ##### toujou-Elementbibliothek [Texte ❯ ](https://www.toujou.de/service/elementbibliothek/text-elements/) [Medien ❯ ](https://www.toujou.de/service/elementbibliothek/media-elements/) [Combinations❯ ](https://www.toujou.de/service/elementbibliothek/combined-elements/) [Teaser ❯ ](https://www.toujou.de/service/elementbibliothek/teaser-elements/) [Cards ❯](https://www.toujou.de/service/elementbibliothek/card-elements/) [Blockquotes ❯ ](https://www.toujou.de/service/elementbibliothek/blockquote-elements/) [Collections ❯](https://www.toujou.de/service/elementbibliothek/collections/) [Maps ❯ / ](https://www.toujou.de/service/elementbibliothek/map-elements/)[Blog ❯ ](https://www.toujou.de/service/elementbibliothek/blog-elements/) [Events ❯ ](https://www.toujou.de/service/elementbibliothek/events/)/ [Widgets ❯ ](https://www.toujou.de/service/elementbibliothek/widgets/) [Navigation ❯](https://www.toujou.de/service/elementbibliothek/navigation-elements/) [HTML ❯ ](https://www.toujou.de/service/elementbibliothek/html/)/ [Forms ❯ ](https://www.toujou.de/service/elementbibliothek/forms/) ##### toujou TOURISM [tourism-Modul ❯](https://www.toujou.de/tutorials/tourism-modul/) [Expertise & Konzept ❯](https://www.toujou.de/websites/websites-fuer-reiseveranstalter/) [Alle Features ❯](https://www.toujou.de/loesungen/etourism/) [toujou-Reiseportale ❯](https://www.toujou.de/warum-toujou/unsere-kunden/#c1002004) [Reiseseiten anlegen ❯](https://www.toujou.de/tutorials/reiseseiten/reisen-anlegen/) [Reiseseiteneigenschaften ❯](https://www.toujou.de/tutorials/reiseseiten/reiseseiteneigenschaften/) [Reisekategorien ❯](https://www.toujou.de/tutorials/reiseseiten/reisekategorien-anlegen/) [Termine & Preise ❯](https://www.toujou.de/tutorials/reiseseiten/termine-preise/) [Reisesuchseiten anlegen ❯](https://www.toujou.de/tutorials/reiseseiten/reisesuchseite/) [Trip Elements ❯ ](https://www.toujou.de/service/elementbibliothek/trip-elements/) [Search Elements ❯](https://www.toujou.de/service/elementbibliothek/trip-elements/search-elements/)