Vertrauenswürdige WordPress-Tutorials, wenn Sie sie am dringendsten benötigen.
Anfängerleitfaden für WordPress
WPB Cup
25 Millionen+
Websites, die unsere Plugins verwenden
16+
Jahre WordPress-Erfahrung
3000+
WordPress-Tutorials von Experten

So fügen Sie einen Zeilenumbruch in WordPress ein (neuer Zeilenabstand)

Haben Sie sich jemals gefragt, warum manche Websites perfekt formatierte Inhalte haben, die leicht zu lesen sind, während andere überladen und schwer zu lesen wirken?

Das Geheimnis liegt oft in etwas Einfachem: richtige Zeilenumbrüche und Abstände.

Wenn Sie jemals Zeilenumbrüche in Ihrem WordPress-Editor hinzugefügt haben und festgestellt haben, dass sie auf Ihrer veröffentlichten Seite nicht angezeigt werden, sind Sie definitiv nicht allein. WordPress behandelt Abstände etwas anders als Textverarbeitungsprogramme wie Google Docs oder Microsoft Word.

Sobald Sie jedoch verstehen, wie es funktioniert, haben Sie die vollständige Kontrolle darüber, wie Ihre Inhalte aussehen.

Wir zeigen Ihnen mehrere zuverlässige Methoden, um Zeilenumbrüche in WordPress hinzuzufügen, von schnellen Tastenkombinationen bis hin zu fortgeschritteneren Formatierungsoptionen.

So fügen Sie einen Zeilenumbruch in WordPress ein

Warum einen Zeilenumbruch in WordPress hinzufügen (neuer Zeilenabstand)?

Auf den ersten Blick mag ein Zeilenumbruch eine kleine Formatierungsentscheidung sein – aber er kann große Auswirkungen darauf haben, wie Ihre Inhalte funktionieren.

Von der Verbesserung der Lesbarkeit bis zur Steigerung der Benutzererfahrung – die richtige Abstände helfen Ihren Seiten, sauber und professionell auszusehen. Hier ist, warum es wichtig ist:

  • Bessere Lesbarkeit: Unterbricht Textblöcke für leichteres Scannen.
  • Mobilfreundlich: Hält Inhalte auf kleineren Bildschirmen klar.
  • Fügt eingefügten Text ein: Bereinigt die Formatierung aus anderen Quellen.
  • Zieht Aufmerksamkeit auf sich: Hilft Tipps und CTAs hervorzuheben.

Kurz gesagt, Zeilenumbrüche machen Ihre Inhalte leichter lesbar und ansprechender – sowohl für Besucher als auch für Suchmaschinen.

Hinweis: Bevor wir beginnen, ist es wichtig zu wissen, dass der Zeilenabstand vom WordPress-Theme gesteuert wird, das Sie verwenden.

Wir zeigen Ihnen, wie Sie Abstände zwischen Blöcken im Block-Editor hinzufügen, und behandeln dann, wie Sie den Zeilenabstand in Ihrem Theme anpassen, wenn Sie mit den Standardergebnissen nicht zufrieden sind.

Nichtsdestotrotz wollen wir uns ansehen, wie Sie ganz einfach einen Zeilenumbruch in WordPress einfügen können.

So fügen Sie doppelten Zeilenabstand zwischen Blöcken hinzu

Wenn Sie die Enter-Taste für Windows oder die Return-Taste für Mac auf Ihrer Tastatur drücken, um einen Zeilenumbruch hinzuzufügen, betrachtet WordPress dies als neuen Absatz.

Das bedeutet, dass automatisch ein doppelter Zeilenabstand hinzugefügt wird. Die Höhe des Abstands wird von Ihrem Theme gesteuert, und diese Formatierung ist eine Standardfunktion aller guten WordPress-Themes.

Doppelte Zeilenabstände in WordPress hinzufügen

Gehen Sie einfach zum Inhaltseditor, drücken Sie die Eingabe- oder Enter-Taste nach der Zeile und geben Sie dann etwas anderes in die nächste Zeile ein.

Indem Sie einfach das tun, sollten Sie basierend auf dem Styling Ihres Themes eine klare Unterscheidung zwischen Absätzen sehen.

Doppelter Zeilenabstand hinzugefügt, um einen Absatz in WordPress zu erstellen

So fügen Sie einen einzeiligen Abstand hinzu

Wenn Sie nun etwas wie eine Adresse schreiben, möchten Sie wahrscheinlich, dass diese auf Ihrer WordPress-Website einfach statt doppelt formatiert ist.

Vorschau mit einfachem Zeilenabstand

In diesem Fall müssen Sie auf Windows die Taste SHIFT + ENTER oder auf dem Mac die Taste SHIFT + RETURN drücken.

Dies teilt WordPress mit, dass Sie innerhalb desselben Absatzes eine neue Zeile beginnen möchten. Diese Aktion erzeugt einen einzelnen Zeilenumbruch anstelle des doppelten Abstands, der für einen neuen Absatz verwendet wird.

Der einfachste Weg: Verwenden des Abstandsblocks

Für eine einfache, codelose Möglichkeit, zusätzlichen Abstand zwischen zwei beliebigen Blöcken hinzuzufügen, ist die Verwendung des integrierten Abstandsblocks die einfachste Methode.

Klicken Sie einfach im Editor auf die Schaltfläche „Block hinzufügen“, um einen neuen Block hinzuzufügen, und suchen Sie nach „Abstand“. Sobald Sie ihn hinzufügen, erscheint ein neuer leerer Bereich auf Ihrer Seite.

Fügen Sie den Abstandsblock in WordPress hinzu

Sie können dann auf den Abstand klicken und den blauen Griff nach oben oder unten ziehen, um seine Höhe anzupassen.

Dies gibt Ihnen präzise Kontrolle über Ihren vertikalen Abstand direkt im Editor.

Abstand funktioniert im Block-Editor

Zeilenhöhe und Abstand ändern

Manchmal, selbst wenn Sie den richtigen Zeilenabstand im Editor einfügen, wird er in Ihrem Theme nicht wie gewünscht angezeigt.

Es gibt zwei Möglichkeiten, dies zu beheben:

  1. Ein Plugin verwenden (der einfache Weg)
  2. Manuell mit CSS-Code (fortgeschrittener)

Schauen wir uns zuerst die einfache Methode an.

Zeilenabstand mit einem Plugin hinzufügen

Wenn Sie Stiländerungen an Ihrem Theme vornehmen möchten, ohne Code lernen zu müssen, ist die Verwendung eines Plugins wie CSS Hero der beste Weg, dies zu tun.

CSS Hero macht es einfach, das Design Ihrer WordPress-Website zu ändern, ohne Code zu kennen.

Absatzabstand in WordPress mit CSS Hero hinzufügen

Weitere Details finden Sie in unserem vollständigen CSS Hero-Testbericht.

Wenn Sie größere Änderungen an Ihrem Theme vornehmen möchten, z. B. eine Seitenleiste verschieben oder eine Fußzeile hinzufügen, dann wäre ein Drag-and-Drop-Page-Builder-Plugin eine bessere Option. Ein Page-Builder-Plugin würde es Ihnen auch ermöglichen, kleine Anpassungen wie das Ändern von Schriftfarben oder das Hinzufügen von Zeilenumbrüchen in WordPress vorzunehmen.

Möchten Sie kein Plugin verwenden oder nur diese eine Änderung vornehmen? Dann ist die manuelle CSS-Code-Option vielleicht die beste für Sie.

Absatzabstände manuell mit CSS-Code ändern

Um Zeilenumbrüche manuell ohne Plugin hinzuzufügen, müssen Sie etwas CSS zu Ihrem Theme hinzufügen.

CSS ist im Grunde wie die Formatierungsfunktion in Microsoft Word. Anstatt auf Schaltflächen zu klicken, schreiben Sie einfachen CSS-Code. Es ist nicht so beängstigend, wie manche Anfänger denken mögen. CSS ist sehr leicht zu verstehen, wenn Sie nur Anweisungen befolgen.

Um benutzerdefiniertes CSS zu Ihrem Theme hinzuzufügen, müssen Sie die Seite Darstellung » Anpassen aufrufen. Dies startet den WordPress Theme Customizer, wo Sie in der linken Spalte auf den Reiter „Zusätzliches CSS“ klicken müssen.

Wenn Sie diese Menüoptionen nicht sehen können, verwenden Sie möglicherweise ein Block-Theme. Bitte lesen Sie unseren Artikel zur Behebung des fehlenden Theme-Customizers im WordPress-Adminbereich.

Hinzufügen Ihres benutzerdefinierten CSS

Im Feld für benutzerdefiniertes CSS müssen Sie den folgenden CSS-Code hinzufügen:

Dieser Code zielt auf alle Absatz-Elemente (p) ab, insbesondere innerhalb des Hauptinhaltsbereichs Ihrer Beiträge, den WordPress oft mit der Klasse .post identifiziert. Dies stellt sicher, dass nur Ihre Artikel betroffen sind.

.post p{line-height: 1.5em;}

Die oben gezeigte CSS-Regel ändert den Zeilenabstand des Absatzinhalts auf 1,5em. Em ist eine Einheit für die Typografie.

Benutzerdefiniertes CSS hinzufügen, um die Zeilenhöhe zu erhöhen

Dies ändert nun nur den Abstand für den einzeiligen Abstand.

Wenn Sie den Absatzabstand in WordPress ändern möchten (d. h. doppelten Abstand), müssen Sie Padding hinzufügen.

.post p { 
line-height: 1.5em;
padding-bottom: 15px;
} 

Passen Sie die Zahlen in diesem CSS-Code gerne an. Das Ändern des Werts für padding-bottom ändert den Abstand zwischen Ihren Absätzen.

Sie können auch benutzerdefiniertes CSS mit dem WPCode Plugin zu Ihrer Website hinzufügen. Das Plugin macht es sehr einfach, Code auf Ihrer Website einzufügen und zu verwalten.

Weitere Details finden Sie in unserem Leitfaden zum einfachen Hinzufügen von benutzerdefiniertem CSS zu Ihrer WordPress-Website.

Wenn Sie die Anweisungen nicht lesen möchten, sehen Sie sich einfach unser Video-Tutorial an.

Video-Tutorial

Für eine visuelle Anleitung können Sie sich unser Video-Tutorial unten ansehen. Es behandelt alle Methoden, die wir für das Hinzufügen von ein- und zweizeiligen Abständen in Ihren Inhalten besprochen haben.

WPBeginner abonnieren

Wir hoffen, dieser Artikel hat Ihnen geholfen, einen Zeilenumbruch in WordPress einzufügen. Möglicherweise möchten Sie auch unseren Leitfaden zum Verwenden von WordPress-Blockmustern und unsere Liste der besten Gutenberg-freundlichen WordPress-Themes sehen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.

Offenlegung: Unsere Inhalte werden von unseren Lesern unterstützt. Das bedeutet, wenn Sie auf einige unserer Links klicken, können wir eine Provision verdienen. Sehen Sie wie WPBeginner finanziert wird, warum das wichtig ist und wie Sie uns unterstützen können. Hier ist unser Redaktionsprozess.

Das ultimative WordPress-Toolkit

Erhalten Sie KOSTENLOSEN Zugang zu unserem Toolkit – eine Sammlung von WordPress-bezogenen Produkten und Ressourcen, die jeder Profi haben sollte!

Leserinteraktionen

99 CommentsLeave a Reply

  1. Das war ein riesiges Problem im alten Creator. Ich wusste nie, wie es aussehen würde und musste alle paar Zeilen die Vorschau aufrufen, aber ich denke, mit Gutenberg ist es viel einfacher und ich habe gelernt, einfach Shift+Enter zu verwenden. Ich mache das automatisch und fast unbewusst. Ich weiß nicht warum, aber manche Websites erlauben kein Shift+Enter, nur Enter oder gar nichts, und dann denke ich: „WARUM funktioniert es nicht“!

  2. Ich habe endlich herausgefunden, wie man mit Shift-Enter einzelne Zeilenumbrüche für Gedichte macht, aber wenn der Beitrag veröffentlicht und an Follower gesendet wird, verliert er die Formatierung und alle Zeilen laufen zusammen. Wie behebe ich das?

    • Sie sollten sich mit dem Tool, das zum Senden der Benachrichtigung verwendet wird, bezüglich des Stylings zur Behebung dieses Problems erkundigen.

      Admin

  3. Danke für die Erklärung. Eine Frage habe ich jedoch. Wie kann ich dasselbe auf einem Smartphone machen? Ich bearbeite meinen Blog unterwegs und habe keinen Laptop zur Verfügung. Ich habe versucht, Shift Enter zu drücken, aber das hat nicht funktioniert.

    • Aufgrund der Einschränkungen von Mobilgeräten müssen Sie wahrscheinlich die CSS-Methode verwenden.

      Admin

    • Wenn Sie ein Page-Builder-Plugin verwenden, haben diese möglicherweise eine andere Methode für den einzeiligen/doppelten Zeilenabstand. Andernfalls könnte es sich um einen Plugin-/Theme-Konflikt handeln, bei dem Sie Ihre Plugins deaktivieren und/oder Ihr Theme wechseln müssten, um dies zu überprüfen.

      Admin

  4. Ich möchte den Abstand zwischen normalen Absatzzeilen verringern — meiner Meinung nach ist standardmäßig zu viel Weißraum vorhanden. Ich möchte auch eine halbe Zeile am Ende eines Absatzes hinzufügen, anstatt einer ganzen Zeile: Wordpress scheint standardmäßig nur das Äquivalent eines doppelten Wagenrücklaufs zu tun, was ziemlich zwanzigsten Jahrhundert ist und nicht emuliert, was Word kann. Irgendwelche Ideen?

    • You would want to reach out to the support for your specific theme and they should be able to tell you what CSS needs to be added to reduce your line spacing :)

      Admin

  5. Gott segne dich! Ich bin Ihnen so dankbar, dass Sie das mit dem CSS gepostet haben! Wer hätte gedacht, dass das alles ist, was nötig war, um den Abstand zu ändern! Ich suche schon lange nach so etwas! Vielen Dank!

  6. Ich benutze die "Shift"-Enter-Methode, aber sie erlaubt keine unterschiedlichen Schriftgrößen, wenn ich das tue. Gibt es eine Umgehungslösung?

  7. Ich habe kein zusätzliches CSS. Ich habe alle möglichen anderen Wege versucht, den Absatzabstand zu ändern, aber nichts funktioniert, es sieht wirklich chaotisch aus. Hilfe bitte!!!

  8. Vielen Dank für die Hilfe. Ich habe überall gesucht und wollte es mit einem Plugin machen. Sie haben es so einfach gemacht. Nochmals vielen Dank.

  9. Hallo! Ich möchte einen einfachen Abstand zwischen meinen Absätzen haben und selbst nach dem Drücken von Enter (für den doppelten Abstand) hat sich beim Vorschau der Entwurfs nichts geändert (es ist immer noch alles ein Absatz). Könnte mir jemand helfen?

  10. Hallo
    Ich möchte die Zeilenhöhe und den Zeilenabstand ändern. Allerdings gibt es kein 'Editor'-Symbol (Appearance » Editor) in der CSS-Datei des Themes.
    Was kann ich also tun?
    Vielen Dank für Ihre Antwort!

  11. Vielen, vielen, vielen Dank!

    Ich war in einem anderen HTML-Editor und konnte nicht herausfinden, wie man einen einzelnen Abstand einfügt.

    You saved the day! :)

  12. Genial und ein ewiger Lebensretter.

    Ich hatte Schwierigkeiten mit dem Abstand auf einer meiner Kunden-Websites und es ist absolut erstaunlich, dass Sie die genaue Antwort fast zur Hand hatten. Ich werde jetzt ein permanenter Abonnent.

  13. Danke für all die Wordpress-Tipps. Diese Seite hat mir bei den meisten Schwierigkeiten, die ich hatte, sehr geholfen

  14. Ich benutze das Pilcrow-Theme und habe keine Ahnung, wie ich den doppelten Abstand zwischen den Absätzen erzeugen kann. Manchmal passiert es in meinen Beiträgen, manchmal aber auch nicht. Wenn ich in die HTML-Datei schaue, sehe ich kein Post-p oder Padding. Ich sehe nur das Endergebnis, wie der Beitrag aussehen wird, und dann weiß ich, dass der doppelte Abstand nicht funktioniert hat. Kann ich trotzdem zurückgehen und es neu bearbeiten und reparieren? Zu guter Letzt habe ich unter "Darstellung" nicht die von Ihnen genannten Menüpunkte "Editor".
    Ich habe unter "Darstellung" folgende Optionen: Themes, Anpassen, Widgets, Menüs, Header, Hintergrund, AMP, Theme-Optionen, Mobil.
    Bitte helfen Sie mir.

  15. Mein Theme ist kaputt, da es standardmäßig keinen doppelten Abstand hat. Das Theme ist in anderen Worten im Shift+Enter-Modus stecken geblieben. Also in Bezug auf den folgenden Code:

    .post p { line-height: 1.5em; padding-bottom: 15px; }

    Ist 15px ein normaler Standard-Doppelabstand? Wie viele Pixel sollten es standardmäßig sein? Spielt es auch eine Rolle, wo ich diesen Code platziere? Danke!

  16. Vielen Dank für den Tipp mit Shift + Enter. Das wusste ich jahrelang nicht. Ihre Website ist immer eine Rettung, wenn ich feststecke.

  17. Hallo: Wie bekomme ich einen benutzerdefinierten Zeilenabstand (z. B. 1,5em) für eine einzelne Instanz auf einer Seite, anstatt das gesamte Theme-CSS zu ändern? Ich sehe, dass zwei andere Personen dieselbe Frage gestellt haben, ohne Antwort, zumindest nicht, dass ich gefunden habe. Danke!

  18. Shift+Enter, um einen riesigen Abstand zwischen den Zeilen im WYSIWYG TinyMCE-Editor in WordPress zu vermeiden. Funktioniert !!!! Großartig!

  19. Wie wäre es, einfach etwas Text hinzuzufügen und die Textfarbe auf Weiß zu ändern (wenn der Hintergrund weiß ist)? Dies sollte es einfacher machen, Zeilenabstände zu erstellen und anzupassen (es sei denn, der Hintergrund ist natürlich ein Bild von etwas, das nicht mit der Schriftfarbe übereinstimmt).

  20. Hallo WPBeginner-Mitarbeiter,

    Ich habe eine andere Frage. Ich benutze Visual Composer und habe viele Trennlinien mit Text zwischen meinen Abschnittsüberschriften auf meiner Homepage hinzugefügt. Ich möchte, dass diese Textüberschriften auch ein Link zu diesem Abschnitt sind.
    Wenn ich jedoch den Link hinzufüge, verliere ich den Text, der die Abschnitte identifiziert, den ich in der Trennlinie hatte, und er wird magisch durch den Standardtext „TITLE“ ersetzt.

    Um zu versuchen, es zu einem Link zu machen, füge ich den Verknüpfungscode in diese Klammer ein:
    [vc_text_separator title=”AUTOS DER 1950ER JAHRE”]

    Ich kratze mir so sehr den Kopf, dass ich glaube, ich bin kahl. Jede Hilfe wird Ihnen lebenslange Dankbarkeit einbringen!!!

    Danke,
    Mike

  21. Ich benutze das WordPress-Theme 'Divi' und habe festgestellt, dass, wenn Sie die Eingabetaste (oder Umschalt + Eingabetaste) zweimal drücken, um einen größeren Abstand zu erzeugen, dies ignoriert wird. Um dies zu umgehen, drücken Sie die Eingabetaste einmal, geben Sie ein Zeichen in die Zeile ein (es spielt keine Rolle, welches), markieren Sie es und ändern Sie die Schriftfarbe des Zeichens auf Weiß und drücken Sie dann erneut die Eingabetaste. Dies ergibt den gewünschten Abstand zwischen den Zeilen, ohne das Theme bearbeiten zu müssen. Dasselbe gilt für zusätzliche Leerzeichen in einer Zeile; geben Sie so viele Zeichen ein, wie gewünscht, markieren Sie sie und ändern Sie ihre Schriftfarbe auf Weiß und fahren Sie dann in der gewünschten Schriftfarbe fort.

  22. THANK YOU!! I Love you guys! So glad I found this site! I’ve almost literally been banging my head against the wall. If I knew how to insert emojis, this post would be covered with hearts and smiley faces. :-)

    • P.S. ~ HA! Ich wusste NICHT, dass mein kleiner Doppelpunkt und meine Klammern tatsächlich zu einem Smiley werden würden. LOL

  23. Oh ja! Sie haben mir gerade geholfen, ein Problem zu lösen (erzwungene einzeilige Absätze), das mich seit Jahren plagt!

  24. Ich bin Abonnent von WP Beginner.
    Ich hatte eine Frage zur Eingabe von technischen Daten für mein Produkt auf meiner Website. Der Abstand in den Tabellen schien auf der Seite zu groß zu sein. Ich habe den WordPress-Support durchsucht und alles, was ich sah, waren knappe Antworten auf die Frage nach einzeiligem Abstand.

    Sie sind der Erste, der die Frage beantwortet, und sie war offensichtlich richtig. Danke.

    Mit freundlichen Grüßen,

    Dave

  25. Was ist mit Android? Das neueste Update hat einen doppelten Zeilenabstand (neuer Absatz) erzwungen. Nicht sehr gut für Poeten. Gibt es eine Möglichkeit, es wieder auf einfach zurückzusetzen?

  26. Ich benutze das Omega Theme und Strg+Enter funktioniert nicht. Kann ich etwas anderes tun? Ich kann post.p nicht in der CSS-Datei finden.

  27. Danke für die „Umschalttaste“ und die Eingabetaste für den einzeiligen Abstand, da ich das seit Jahren herausfinden wollte … und nie dazu kam, die Lösung zu finden.

  28. Ich suche überall nach einer Antwort... wenn ich ein
    im Texteditor einfüge, wird es im visuellen Editor entfernt. Das macht mich wahnsinnig. Hat wpbeginner eine Empfehlung?

    Soll ich ein Plugin hinzufügen, um das zu stoppen?

    Ich habe vor Jahren ein Plugin ausprobiert, aber ich musste jeden Beitrag zurückgehen und neu formatieren.

    Jeder Link mit Tutorials oder Ratschlägen wird sehr geschätzt!

Kommentar hinterlassen

Vielen Dank, dass Sie einen Kommentar hinterlassen. Bitte beachten Sie, dass alle Kommentare gemäß unserer Kommentarrichtlinie moderiert werden und Ihre E-Mail-Adresse NICHT veröffentlicht wird. Bitte verwenden Sie KEINE Schlüsselwörter im Namensfeld. Führen wir ein persönliches und bedeutungsvolles Gespräch.