Divi Logo beim scrollen ändern
Вставка
- Опубліковано 5 жов 2024
- In diesem Video lernst du, wie du das Logo deiner Divi-Website ändern kannst, sobald der Website-Besucher anfängt zu scrollen. Voraussetzung dafür ist, dass du deinen Header mit dem Divi Theme-Builder erstellt hast.
Der Code zum einfügen lautet:
content: url(URL.png);
Statt URL, fügst du die URL deines Logo's ein.
Möchtest du die Größe des Logos anpassen, füge noch folgenden Code ein und ändere die 60 in einen Wert seiner Wahl:
max-height: 60px;
Viel Spaß beim nachmachen :)
Hast du Fragen oder Anmerkungen, dann hinterlasse mir gerne einen Kommentar.
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Wann immer du bereit bist, hier sind einige Wege, wie ich dich unterstützen kann:
🔴 Done for you: Falls deine Zeit oder Wissen begrenzt ist.
www.hhess.de/b...
🟡 Done with you: 90 Minuten, 1:1 Workshop via Zoom.
www.hhess.de/y...
🟢 Do it yourself: Website mit Divi selbst erstellen
www.hhess.de/y...
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
▶ ANGEBOTE (0 EURO)
🔴 Exklusive Online-Business & Website-Tipps: www.hhess.de/y...
🟡 WordPress Einsteigerkurs: www.hhess.de/y...
🟢 Linktree Vorlage für Divi: www.hhess.de/y...
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
▶ EMPFEHLUNGEN
✅ Divi-Theme: www.hhess.de/e... *
✅ Divi Pixel: www.hhess.de/e... *
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
▶ DIR GEFALLEN MEINE VIDEOS?
💖 Spendier' mir doch nen Kaffee: www.buymeacoff...
💖 Hinterlasse ein Feedback, dass mich umhaut: www.hhess.de/g...
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
▶ ÜBER DIESEN KANAL
Auf diesem Kanal findest du hilfreiche Videos zu WordPress, Divi und Co. Hier bekommst du nicht nur die Grundlagen vermittelt, sondern kannst mit den einfachen Schritt für Schritt Anleitungen, alles ganz einfach nachmachen. Mein Ziel ist, Online-Unternehmern das Thema WordPress-Website näher und verständlicher rüber zu bringen, damit du unabhängig deine Website erstellen und bearbeiten kannst.
🚨 Kanal abonnieren: www.hhess.de/a...
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
▶ LINKS
🚀 Instagram: / hiacynta.hess
🚀 Website: www.hhess.de
🚀 Podcast: www.hhess.de/y...
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
▶ TRANSPARENZHINWEIS
Die Inhalte dieses Kanals stelle ich dir kostenlos zur Verfügung!
Alle Links die mit einem * gekennzeichnet sind, sind sogenannte Affiliate Links. Bestellst du etwas über diesen Link, erhalte ich eine minimale Provision. Für dich entstehen keine zusätzlichen Kosten. Generell empfehle ich nur Tools bzw. Anbieter, die ich selbst getestet habe und uneingeschränkt empfehlen kann. Danke für deine Unterstützung!
Hallo Hiacynta! Erstmal vielen Dank für deine tollen Videos!
Zu diesem Video habe ich allerdings noch eine Frage. Beim Menü Logo kann ich eine Verlinkung eingeben. Sobald über den hier dargestellten Code das Bild für den Sticky-Modus geändert wird, ist die Verlinkung aber nicht mehr da.
Kann ich auch für den Sticky-Header einen Link auf das Bild legen?
Ich hoffe, du verstehst was ich meine. Ganz liebe Grüße aus Österreich
Danke für den Hinweis! Hab ich tatsächlich nicht beachtet.
Lösche mal den CSS Code den du bei dem CSS Feld (Menu Logo) eingefügt hast. Dann wechselst du bei benutzerdefinierte CSS auf das Feld Freiform CSS. Dort hast du dann ein Feld in dem du folgenden Code einfügen kannst:
.has_et_pb_sticky .et_pb_sticky.et_pb_menu.selector .et_pb_menu__logo img {
content: url(deinedomain/bild.png);
}
hier musst du nur die URL von dem neuen Bild austauschen und dann sollte es klappen. Hab es auf meiner Testseite ausprobiert und das hat auf Anhieb funktioniert
Super, vielen Dank! Wird ausprobiert. 🙏
Hi Hiacynta! Ich habe die Größe meines "Hauptlogos" an die jeweilige Displaygröße angepasst (Desktop/Tablet/Smartphone), aber für das Logo im sticky-Mode will mir das nicht gelingen. Hast du einen Tipp für mich? Vielen Dank schon vorab!
Hallo! Bei mir funktioniert es bisher nicht und ich bin mir nicht sicher, wo mein Fehler liegt. Kann es sein, dass es nur geht, wenn es keine zwei Spalten sind? Ich habe in der linken Spalte mein Logo und in der rechten, breiteren Spalte dann das Menü. Könnte das der Grund sein, warum sich dann nichts verändert? Schon im Vorfeld ganz lieben Dank!
Okay, das Menü nun neu aufgebaut in einer Spalte. Und schon hat es sofort funktioniert. Auf die Idee hätte ich auch schon vor Stunden kommen können. 🙃 Nun gut. Meine Frage hat sich damit erledigt und vielleicht erspare ich nun zumindest einer anderen Person mit dem Hinweis noch Zeit.