Springe zum Hauptinhalt

Wie einrücken Absätze auf Wordpress

Divi: das am einfachsten zu verwendende WordPress-Theme

Divi: Das beste WordPress-Theme aller Zeiten!

Mehr 901.000 Downloads, Divi ist das beliebteste WordPress-Theme der Welt. Es ist vollständig, einfach zu bedienen und enthält mehr als 62-freie Vorlagen. [Empfohlen]

Wollen Sie Leerzeichen hinzufügen oder Unterabschnitte auf WordPress eingerückt? Möchten Sie Absätze in WordPress einrücken?

Obwohl der größte Teil Ihres Textes linksbündig ist, müssen Sie in einigen Fällen möglicherweise bestimmte Absätze für a einrücken beste Typografie und ein besseres Leseerfahrung.

In diesem Tutorial zeigen wir Ihnen, wie Sie einrücken leicht Absätze auf WordPress.

Absätze in WordPress einrücken

Methode 1: Verwenden der Texteinrückungsschaltflächen im visuellen Editor 

Standardmäßig die meisten WordPress-Themes Zeigen Sie rechts oder links ausgerichtete Absätze für Sprachen von rechts nach links an.

Wenn Sie einen Absatz verschieben möchten, können Sie dies manuell tun, indem Sie auf die Schaltfläche klicken Einrückung erhöhen des visuellen Texteditors. Dadurch wird der Abstand links vom Absatz erhöht.

Absätze in WordPress einrücken

Wenn Sie mehr als einen Absatz einrücken möchten, müssen Sie diese Absätze auswählen und dann auf die Schaltfläche klicken Einrückung erhöhen.

Sie können mehrmals auf die Schaltfläche klicken, um den Einzug zu vergrößern. Wenn Sie beispielsweise darauf doppelklicken, wird der Einrückungsabstand verdoppelt.

Sie können die Auszahlung auch reduzieren, indem Sie auf die Schaltfläche klicken Einrückung verringern

Wir laden Sie auch ein, bevor Sie weiter entdecken Verwendung des Gutenberg-Editors für WordPress 5.0: Teil XNUMX

Methode 2: Manuelle Einrückung Absatz mit dem Texteditor

Verwenden der Auszahlungstasten text Im visuellen Editor können Sie Absätzen am einfachsten Einrückungen hinzufügen. Dies gibt Ihnen jedoch keine Kontrolle darüber, wie viel Abstand Sie hinzufügen möchten.

Die meisten fortgeschrittenen Benutzer können zu wechseln Texteditor um den Einzug manuell hinzuzufügen. Sie müssen lediglich den Text in das Absatz-Tag einfügen und und dann y CSS-Code hinzufügen wie folgt:

Ihr Absatztext geht hier ...

Absatz manuell auf WordPress einrücken

Erstellen Sie ganz einfach Ihre Website mit Elementor

Mit Elementor können Sie auf einfache Weise jedes Website-Design mit einem professionellen Look erstellen. Zahlen Sie nicht mehr teuer für das, was Sie selbst tun können. [Kostenlos]

Mit dieser Methode können Sie den Abstand steuern, den Sie als Einzug verwenden möchten. Diese Methode funktioniert am besten, wenn Sie Absätze nicht regelmäßig einrücken müssen.

Wenn Sie sie also oft genug einrücken, ist dies keine ideale Lösung.

Entdecken Sie unseren Guide auf Wie kommt man zu (schreiben) einen guten Absatz auf Ihrem Blog 

Methode 3: Nur die erste Zeile eines Absatzes einrücken

Webseiten verwenden nicht den traditionellen Absatzabstand von Textverarbeitungsprogrammen, der nur die erste Zeile des Absatzes markiert.

Selbst in WordPress wird beim Einrücken eines Absatzes dem gesamten Absatz Leerzeichen hinzugefügt.

Beispiel für einen Absatzeinzug

Einige Websites von Zeitschriften oder Literaturzeitschriften möchten möglicherweise eine traditionellere Entfernung hinzufügen. In diesem Fall müssen Sie Ihrem WordPress-Theme benutzerdefiniertes CSS hinzufügen.

Gehe zu " Aussehen> Anpassen Um die " Konfigurator Des WordPress-Themas. Klick auf das " zusätzlicher CSS ".

Zusätzliches CSS-Customizer-WordPress

Daraufhin wird im linken Bereich ein Textfeld angezeigt, in dem Sie Ihren benutzerdefinierten CSS-Code hinzufügen können. Fügen Sie diesen CSS-Code in dieses Textfeld ein.

p.custom-indent {text-indent: 60px; }

Entdecken Sie auch unsere Tutorial: Wie man den WordPress Visual Editor beherrscht

Suchst du nach den besten WordPress Themes und Plugins?

Laden Sie die besten Plugins und WordPress-Themes auf Envato herunter und erstellen Sie ganz einfach Ihre Website. Schon mehr als 49.720.000 Downloads. [EXCLUSIVE]

Dieser CSS-Code teilt den Browsern lediglich mit, dass ein Absatz mit einem 60px-Einzug hinzugefügt wird, wenn er die Klasse ".custom-indent" enthält.

Anschließend können Sie Ihren Artikel im Texteditor bearbeiten. Umgeben Sie dann Ihren Text mit den Tags und wie folgt :

Ihr Absatztext geht hier ...

Sobald Sie fertig sind, können Sie eine Vorschau Ihres Artikels anzeigen, und Sie werden feststellen, dass nur die erste Zeile des Absatzes zuvor einen Abstand aufweist.

Abstand vor einem Absatz

Diese Methode funktioniert sorgfältig, wenn Sie nur einige Absätze einrücken möchten. Wenn Sie diesen Stil jedoch allen Absätzen Ihrer Website hinzufügen möchten, müssen Sie den benutzerdefinierten CSS-Code einfach wie folgt ändern:

Artikel p {text-indent: 60px; }

Dieser CSS-Code fügt automatisch einen Einzug in die erste Zeile aller Absätze in einem WordPress-Beitrag oder einer WordPress-Seite ein.

Entdecken Sie auch vor der Abreise Wie man einen visuellen Stil der Wordpress-Editor hinzufügen

Für diejenigen, die nach visuellen Editoren suchen, um das Erscheinungsbild ihrer Website zu verbessern, bieten wir hier 3 Premium-WordPress-Plugins an, die für diese Aufgabe entwickelt wurden.

1. Gelber Bleistift: Visual Style CSS Editor

Yellow Pencil ist ein visueller Stileditor, den Sie mit jedem Thema verwenden können, um Ihre Website in wenigen Minuten zu personalisieren (Schriftarten, Farben, Animationen und mehr…).Yellowpencil Visual CSS Style Editor Plugin WordPress

Dieses Plugin erstellt CSS-Stile im Hintergrund, während Sie mit Farben spielen, als wäre es ein Spiel. Es wurde sowohl für Anfänger als auch für erfahrene Benutzer entwickelt. Es sind keine Codierungskenntnisse erforderlich. Das Plugin hat jedoch einen guten CSS-Editor für diejenigen, die gerne codieren. Mit diesem Editor können Sie live codieren und Ihr CSS anpassen.

Download | Demo | Web-Hosting

2. Easy Custom JS und CSS 

Dieses Premium-WordPress-Plugin ist ein leistungsstarker CSS- und Javascript-Code-Editor, mit dem Sie diese zu jedem Abschnitt Ihrer Website hinzufügen können. Damit können Sie Ihre Anpassungen auch nach einem größeren Update Ihres WordPress-Themas beibehalten. Einfache benutzerdefinierte js und css zusätzliche Anpassung WordPress-Plugin

Sie haben die Möglichkeit, den Verwendungsbereich Ihres personalisierten Codes einzuschränken. Beispielsweise können Sie Ihren Code nur für einen Artikel im Videoformat verwenden. Oder Sie können Ihren Code auf ein bestimmtes Thema beschränken. Dies ist praktisch, wenn Sie häufig Themen für Ihr WordPress-Blog ändern.

Download | Demo | Web-Hosting

3. Custom JS und CSS für Gutenberg

Mit dem WordPress Custom JS- und CSS for Gutenberg-Plugin können Sie dem WYSIWYG-Editor eine unbegrenzte Anzahl von benutzerdefinierten Stilen für Ihre WordPress-Beiträge und -Seiten hinzufügen. Es ist voll kompatibel mit der Gutenberg-Version von WordPress.Benutzerdefinierte js und css für gutenberg WordPress-Plugin

Mit einem benutzerfreundlichen CSS-Editor können Sie einfach einen neuen Stil erstellen. Dieses Plugin erweitert die Funktionalität von benutzerdefinierten Feldern auf Ihrer Site und bietet Ihnen die Möglichkeit, Ihre benutzerdefinierten Felder mit einem dynamischen und leistungsstarken Anpassungsmodul zu ändern. und die Echtzeit-Vorschau-Funktion dieses Plugins macht es sehr komfortabel und benutzerfreundlich.

Erstellen Sie einfach Ihren Online-Shop

Laden Sie kostenlos WooCommerce herunter, die besten E-Commerce-Plugins, um Ihre physischen und digitalen Produkte auf WordPress zu verkaufen. [Empfohlen]

Download | Demo | Web-Hosting

Empfohlene Ressourcen

Entdecken Sie andere empfohlene Ressourcen, die Ihnen helfen werden Übernehmen Sie besser die Kontrolle über Ihren visuellen Texteditor.  

Fazit

Hier ! Das war's für dieses Tutorial. Ich hoffe, Sie können damit die Einrückung Ihrer Artikel besser organisieren. fühlen sich frei Teilen Sie den Tipp mit Ihren Freunden in Ihren sozialen Netzwerken.

Wenn Sie Vorschläge oder Anmerkungen haben, sind diese willkommen. Wir laden Sie auch ein, unsere zu konsultieren Ressourcen, wenn Sie ein Anfänger Blogger sind.

... 

Dieser Artikel enthält 1 Kommentar

  1. Artikel p {Bindestrich: 60 px; }
    Zeichenfolge, die einen Fehler gibt.
    Der Validierungsdienst gibt mir auch den Fehler "60px; } "
    Wie sollen wir korrigieren?
    gute Arbeit

Hinterlassen Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Zurück nach oben