Mehrere Absätze (Leerzeilen) sichtbar machen

Wenn du einen Beitrag mit WordPress schreibst, oder deine Seite mit Inhalt füllst, kommst du je nach eigener Erfahrung an kleine Hürden, die es zu meistern gilt. Eine dieser Hürden könnte sein, dass mehrere leere Absätze, welche im Backend noch mit entsprechendem Abstand je Absatz erscheinen, plötzlich im Frontend nur noch als eine Zeile angezeigt werden.

Lösung 1 – Der Abstandshalter-Block

Die erste und wohl einfachste Lösung wäre, du nutzt den Gutenberg-Block „Abstandshalter“. Hier kannst du die gewünschte Höhe deines Abstandes eingeben und schon bist du fertig. Die Blöcke kannst du dann zwischen deinem Inhalt einfügen und so für den gewünschten Abstand sorgen.

Lösung 2 – eigenes CSS

Wenn sich die in Lösung 1 erwähnten Abstandsblöcke mit deinem Inhalt umständlich anfühlen und du sehr viele davon nutzen musst, würde ich zur nächsten Alternative greifen und mittels CSS nachsteuern.

Da die leeren Absätze nicht (mehr wie im früheren Editor, dem TinyMCE) weggekürzt, sondern lediglich optisch zusammengezogen werden, kannst du mit wenigen CSS-Zeilen nachsteuern.

Eine Möglichkeit wäre, den bestehenden (leeren) Absätzen eine Mindesthöhe mitzugeben und schon erscheinen sie wie gewünscht mit mehreren Zeilen Abstand. Im Beispiel nutzen wir 20px Abstand. Passe diese Zahl gerne nach deinen Wünschen an. Der CSS-Code dafür sieht wie folgt aus. Füge diese Zeilen in deinem Gutenberg unter „individuelles CSS“ hinzu.

p:empty {
  min-height: 20px;
}

Die weitere Entwicklung

Es gibt bei der Weiterentwicklung des Gutenberg-Editors diverse Diskussionen darüber, ob ein „Abstandshalter“ ab drei Umbrüchen automatisch erfolgen sollte. Derzeit ist das noch nicht so, aber die Entwicklung und Community nimmt sich dem Problem in jedem Fall an. Dies dauert erfahrungsgemäß etwas und bis dahin hast du nun eine Alternative Lösung für dich. 🙂

Schreibe einen Kommentar