Wie blende ich das Menü auf einzelnen WordPress-Seiten aus?

Mit Custom CSS über die Seiten-ID: #page-id .main-header { display: none; }. Alternativ bieten Divi und andere Page Builder die Option, Header und Footer pro Seite individuell zu steuern.

WordPress Menü und Header auf einzelnen Seiten ausblenden

Autor

Marius Marzian

Datum 17. August 2021

Kategorie SEO

Inhalt

Methode 1: Per CSS (einfach, ohne Plugin)
Methode 2: Per Plugin (empfohlen)
Methode 3: Per PHP im functions.php
Welche Methode ist die beste?

Methode 1: Per CSS (einfach, ohne Plugin)

Die schnellste Lösung für technisch versierte Nutzer: Du kannst Header und Menü per CSS auf bestimmten Seiten verstecken. WordPress vergibt automatisch eine Klassen-ID für jede Seite am Body-Tag, z.B. page-id-42.

Rufe deine Seite auf und inspiziere das <body>-Tag im Browser (Rechtsklick → Untersuchen)
Notiere die Klasse, z.B. page-id-42
Füge folgenden CSS-Code in Design → Customizer → Zusätzliches CSS ein:

.page-id-42 #header,
.page-id-42 #site-navigation,
.page-id-42 .main-navigation {
    display: none !important;
}

Die genauen CSS-Klassen für Header und Navigation hängen von deinem Theme ab.

Methode 2: Per Plugin (empfohlen)

Das Plugin „Hide Page and Post Title“ oder „Header Footer Code Manager“ bieten eine saubere Oberfläche für solche Anpassungen. Besonders einfach ist es mit Page-Buildern wie Divi oder Elementor:

Mit Divi (Divi Theme Builder):

Gehe zu Divi → Theme Builder
Klicke auf „Add Global Header“ oder „Add Template“
Wähle „Create Custom Header“
Weise das Template nur bestimmten Seiten zu und lasse den Header-Bereich leer

Mit Elementor:

Installiere Elementor Pro (Theme Builder)
Gehe zu Elementor → Theme Builder → Header
Erstelle ein leeres Template und weise es den gewünschten Seiten zu

Methode 3: Per PHP im functions.php

Für Entwickler: Füge folgenden Code in die functions.php deines Child-Themes ein:

function hide_header_on_page() {
    if ( is_page( 42 ) ) { // Seiten-ID hier anpassen
        remove_action( 'get_header', 'wp_nav_menu' );
    }
}
add_action( 'wp', 'hide_header_on_page' );

Achtung: Ändere immer nur das Child-Theme, nie das Parent-Theme direkt – sonst gehen Änderungen beim nächsten Update verloren.

Welche Methode ist die beste?

CSS: Schnell, aber der Header wird nur visuell versteckt – er ist noch im Quellcode vorhanden
Plugin/Page-Builder: Sauberste Lösung, empfohlen für Landing Pages
PHP: Geeignet før Entwickler, die volle Kontrolle möchten