Wenn Sie den Standardheader des Divi-Themes verwenden, können Sie beim Scrollen ganz einfach ein anderes Logobild anzeigen lassen. Zum Beispiel ein Bild, das keine Textsubline enzhält, weil diese womöglich beim Scrollen zu klein erscheint, um noch lesbar zu sein.
Wir setzen den Trick übrigens zur Veranschaulichung in diesem Beitrag ein. Scrollen Sie ein Stück runter und wieder hoch und beobachten Sie den Logowechsel ganz oben an der Seite: Das übliche Dr. Code-Logo wird ersetzt mit der reinen Bildmarke.
Der Hack ist simpel, funktioniert aber nur mit dem Standard-Header des Divi-Themes: Kopieren Sie folgende Zeilen in das CSS-Stylesheet Ihrer Website. Dieses erreichen Sie unter Design/Customizer:
@media only screen and (min-width : 981px) {
.et-fixed-header #logo {
content: url(URL-ZUM-BILD);
}
}In Zeile 3 müssen Sie noch den Term «URL-ZUM-BILD» mit einer Bild-URL aus Ihrer Mediathek ersetzen – und schon funktionierts.
Der vorliegende Code tauscht das Logo lediglich in der Desktop-Ansicht aus. Wenn das Logo auch auf Mobiltelefonen und Tablets ausgetauscht werden soll, lassen Sie in obigem CSS-Code einfach die Zeilen 1 und 5 weg.
Werbung
Werbung
