Trick # 381 | Dieser Beitrag beinhaltet 657 Wörter. – Geschätzte Lesezeit: ca. 4 Minuten.
Im Button-Modul des Divi-Themes lässt sich standardmässig bloss eine einzige Textzeile platzieren. Wem das nicht genügt und wer gerne eine zweite Textzeile hätte, muss ein wenig nachhelfen. Wir zeigen Ihnen wie.
Normalerweise sieht der Button mit einer Textzeile etwa so aus wie nebenan:
Da sich im Buttontext kein HTML platzieren lässt, benötigen Sie für die zweite Zeile Button-Text ein kurzes Stück CSS-Code. Dieser Block folgt unten – fügen Sie ihn im Button-Modul, unter dem Tab «Erweitert» und «Benutzdefinierte CSS» ins Feld «Vorher» ein:
content: 'Zusätzliche Textzeile';
position: relative;
display: block;
opacity: 1;
margin: 0;
font-size: 20px;
padding-top: 5px;Der Text in Zeile 1 ist beispielhaft – Sie sollten ihn natürlich anpassen.
Ebenfalls wichtig: Den Button-Text im «Inhalt»-Tab des Buttons müssen Sie ebenfalls ausfüllen. Der Text aus dem CSS-Code wird dann oberhalb dieses «normalen» Buttontexts angezeigt.
Das Ergebnis sieht dann aus wie nebenan:
Leider funktioniert der Hack nur zuverlässig, wenn Sie das Button-Icon rechts verwenden. Ohne Icon wird bisweilen gar keine zweite Zeile angezeigt – mit Button links nur eine in Hieroglyphen.
Werbung
Werbung
