Wie kann ich einen Text auf einem Bild lesbar machen?
Mit Divi hast du die Möglichkeit, einen Text auf einem Bild zu platzieren. Meistens wird dazu das Bild als Hintergrundbild einer Sektion eingefügt und ein Text-Modul genutzt. Fügst du allerdings ein anderes Hintergrundbild ein (hier geht es zur ausführlichen Anleitung), kann es vorkommen, dass der Text dann nicht mehr lesbar ist. Egal ob dieser schwarz oder weiß gefärbt wird.
Bild als Hintergrundbild einer Sektion & Modul "Text":
Neues Bild als Hintergrundbild einer Sektion & Modul "Text":
Du hast nun zwei verschiedene Möglichkeiten, deinen Text lesbar zu machen:
- Du fügst einen Text-Schatten hinzu
- Du gibst dem Hintergrundbild eine dunkle (oder helle), leicht transparente Farbfläche
Möglichkeit #1: Text-Schatten hinzufügen
Öffne dazu bitte die Einstellungen des Text-Moduls durch Klick auf das Zahnrad-Symbol:
Navigiere dann zur Registerkarte "Entwurf" und klicke auf die Option Text:
Scrolle nach unten, bis du zu der Option "Text Shadow" kommst:
Klicke einfach einen der gewünschten Effekte an. Du hast dann auch die Möglichkeit, individuelle Einstellungen vorzunehmen.
Möglichkeit #2: Transparente Farbfläche über das Hintergrundbild
Öffne dazu bitte die Einstellungen der entsprechenden Sektion (im Bild unten blau) durch Klick auf das Zahnrad-Icon:
Bei der Option "Hintergrund" fügst du als erstes eine Farbe ein – am besten ein dunkles Grau (HEX-Code: #666666):
Bisher zeigt es noch nicht das gewünschte Ergebnis. Denn die Farbe wird unter das Hintergrundbild gelegt und ist nicht sichtbar.
Um dies sichtbar zu machen, musst du bei den Option Hintergrund > Bild einen Bild-Effekt hinzufügen. Klicke dazu bitte auf die Option Bild:
Und gehe dann zu der Option Background Image Blend und wähle dort "Multiply" (= multiplizieren) aus:
Dies bewirkt, dass die Hintergrundfarbe nun durch das Bild "durchscheint" und die Schrift somit deutlich lesbarer ist.