Text Overlays peppen das Design in vielerlei Hinsicht auf
Damit ihr überhaupt seht, was wir hier gemeinsam in den nächsten Minuten erstellen werden anbei eine kleine Vorschau: In diesem Videotutorial zeige ich Euch wie man in Divi ganz einfach Bilder mit farbigen Text Overlay erstellen kann.
Aus der Divi-Community stand die Frage im Raum, wie man ohne gross Code schreiben zu müssen farbige Text-Overlays über Bilder legen kann. Ich bin mir sicher, da gibt es einige verschiedene Wege dies zu erreichen. Meinen Weg zeige ich Dir in diesem Video.
Grosses «Indianerehrenwort» – das dauert nicht lange und ist echt simpel und einfach umzusetzen. Den dazugehörigen CSS Code zum kopieren, findest Du unterhalb des Videos.
CSS zum kopieren:
Ihr könnt Euch den CSS Code direkt in das style.css des Child Themes reinkopieren oder unter Divi Optionen bitte ganz runterscrollen und dort in das CSS Feld platzieren.
.bh_hover_overlay .et_pb_text {
opacity:0;
transition: .4s ease-in-out;
}
.bh_hover_overlay .et_pb_text:hover {
opacity:1;
cursor:pointer;
background:rgba(90, 68,255,0.7);
}
Nun hoffe ich, dass ihr Spass hattet und etwas für die Zukunft mitnehmen konntet.
