Lesefortschritt:

Divi-Menu-Hack #2: Separatoren im Menu-Modul des Divi-Themes anzeigen

10. Dezember 2023 | CSS-Stylesheet, Divi-Theme

Dieser Beitrag beinhaltet 402 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.

Das Menu-Modul des Divi-Themes kennt zahlreiche Einstellungsmöglichkeiten. Aber nirgends lassen sich Separatoren zwischen den einzelnen Menupunkten festlegen. Mit diesem Trick gelingt auch dies.

Alles, was Sie benötigen, ist dieser CSS-Code. Fügen Sie ihn in das Stylesheet Ihrer Website ein – im Backend unter Design/Customizer/Zusätzliches CSS:

.et_pb_menu .et-menu.nav > li + li > a:before {
	position: absolute;
	left:-11px;
	transform: translateX(-50%);
	content: '|';
	font-size: smaller;
}

Nun werden im Menu-Modul die Navigationspunkte mit einem «|» voneinander getrennt. Wenn Sie lieber ein anderes Zeichen als Separator verwenden möchten, fügen Sie es einfach auf Zeile 5 des Codes ein.

Werbung

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