Lesefortschritt:

Divi-Header-Navigation ausblenden

9. Januar 2021 | CSS-Stylesheet, Divi-Theme

Dieser Beitrag beinhaltet 275 Wörter. – Geschätzte Lesezeit: ca. 2 Minuten.

Die Header-Navigation in Divi eignet sich nicht für alle Websites gleichermassen. Besonders auf den kleinen One-Pagern, wo alle Inhalte direkt auf der Startseite untergebracht sind, ist der Sinn einer Header-Navigation stark beschränkt. Divi bietet von Haus aus nur die Möglichkeit, das Website-Logo auszublenden, nicht aber die Navigation. Doch es gibt eine Lösung.

Um das Logo im Divi-Theme darzustellen, die Navigation aber auszublenden, benötigen Sie ein paar Zeilen CSS-Code. Diese fügen Sie unter Design/Customizer/Zusäzliches CSS ein:

#et-top-navigation {display:none; }
@media only screen and ( min-width: 981px ) {
#logo { padding-bottom: 18px; }
.et-fixed-header #logo { padding-bottom: 10px; }
}

Mit der ersten CSS-Code-Zeile wird das Navigations-Menü ausgeblendet. Der nachfolgende CSS-Code fügt etwas Abstand unter dem Logo hinzu, damit der Header nach dem Ausblenden der Links nicht zu klein wird.

Ähnliche Beiträge

Hamburger- oder Standard-Navigation: Breakpoint im… Im Divi-Theme wechselt die Navigation standardmässig bei 980px Bildschirmbreite auf das Hamburger-Menu. Das ist meist sinnvoll - aber nicht in jedem Fall. Sie können den so genannten «Breakpoint» darum ganz…
Titel auf Seiten und/oder Beiträgen ausblenden Besonders auf Seiten - ab und an auch in Beiträgen - möchte man den Titel nicht auf der Website zeigen. Dazu gibt es mehrere Möglichkeiten. Solche die global wirken, aber…
Dynamischen Banner aus dem Beitragsbild im Divi-Template… Wenn Sie Beitragsbilder als Header in einem besonderen Zuschnitt (etwa im Letterbox-Style mit 1500x500px) anzeigen wollen, stossen Sie mit Wordpress an Grenzen. Zwar lassen sich dynamische Beitragsbilder durchaus als Hintergrund…
Divi-Menü links und Website-Logo rechts platzieren Das Menümodul des Divi-Themes lässt einige Einstellungen zu: Logo und Menü zentrieren; Logo links und Menü rechts - was aber fehlt, ist die Option das Menü links und das Logo…

Kategorien

Divi-Module

Dr.-Code-Specials

Neueste Beiträge

Geplante Beiträge

Child-Theme erstellen

Wir empfehlen Ihnen den Einsatz eines Child-Themes – damit sind Sie sicher, dass Ihre Anpassungen bei einem Theme-Update nicht überschrieben werden.

Tipps & Tricks per Mail

Mit dem Newsletter von Dr. Code erhalten Sie sporadich die neuesten Hacks und Tricks zu CSS, Divi, Wordpress & Co. direkt in Ihr Mailpostfach.

Themenidee?

Können wir Ihnen zu einem ganz bestimmten Thema weiterhelfen? Unsere Leserinnen und Leser haben oft die besten Ideen.

Themenvorschlag

Treffen Sie Vorsichtsmassnahmen bei der Nutzung der Inhalte dieser Website. Auch wenn die Tipps und Tricks erprobt sind, kann mal was schiefgehen.

Wir empfehlen, möglichst in einer Testumgebung zu arbeiten und/oder Sicherungskopien anzulegen, bevor Sie ans Werk gehen.

Werbung

Kostenlose WordPress- und Divi-Tricks im Abo

Wir schicken Ihnen sporadisch (weniger als 10x jährlich) neue Tricks für Wordpress und das Divi-Theme, aber auch hilfreiche CSS- und HTML-Codes frei Haus.

Füllen Sie zur Anmeldung das folgende Formular aus. Angaben mit * sind Pflichtangaben.

Vielen Dank.

Pin It on Pinterest

Share This