Trick # 362 | Dieser Beitrag beinhaltet 250 Wörter. – Geschätzte Lesezeit: ca. 2 Minuten.
Vielleicht möchten Sie in der Desktop-Ansicht ein anderes Website-Logo zeigen als in der Mobilansicht? Zum Beispiel eines ohne Claim, weil dieser auf Mobilgeräten eh nicht gut lesbar ist? Nichts leichter als das.
Fügen Sie Ihrer Mediathek erst das alternative-Mobil-Logo hinzu, sofern Sie das nicht schon gemacht haben. Öffnen Sie nun das Logo und kopieren Sie den Bildlink.
Anschliessend wechseln Sie in das CSS-Stylesheet Ihrer Website (im Backend unter Design/Customizer/Zusätzliches CSS) und fügen Sie den folgenden CSS-Block ein:
@media only screen and (max-width: 981px) {
#logo {
content: url("http://ihredomain.ch/wp-content/uploads/mobile_logo.png");
}
}Auf Zeile 3 fügen Sie anstelle des beispielhaften Dateipfads den Pfad zu Ihrem Mobillogo ein.
Der Code bewirkt, dass nun auf allen Anzeigen, welche maximal 980 Pixel breit sind, das Mobillogo angezeigt wird.
Werbung
Werbung
