Möchten Sie Ihrem Beitrag oder Ihrer Seite in WordPress eine horizontale Linie hinzufügen?
Horizontale Linientrenner sind eine großartige Möglichkeit, lange Beiträge in kleinere Abschnitte zu unterteilen, besondere Ankündigungen oder Werbeaktionen hervorzuheben und verschiedene Teile einer Seite klar zu trennen.
In diesem Artikel zeigen wir Ihnen, wie Sie ganz einfach einen horizontalen Linienteiler in WordPress hinzufügen.
Da dies eine umfassende Anleitung zum Hinzufügen eines horizontalen Zeilentrenners in WordPress ist, kann es hilfreich sein, unser Inhaltsverzeichnis zu verwenden:
- So fügen Sie einen horizontalen Linienteiler im Blockeditor hinzu
- So fügen Sie einen horizontalen Linienteiler im klassischen Editor hinzu
- So fügen Sie einen horizontalen Linienteiler mit manuellem HTML hinzu
- So fügen Sie andere Arten von Spacern und Seitenumbrüchen in WordPress hinzu
- So unterteilen Sie ein langes WordPress-Formular in mehrere Abschnitte
Hinzufügen einer horizontalen Linie im WordPress-Blockeditor
Um eine horizontale Linie mit dem WordPress-Blockeditor hinzuzufügen, klicken Sie auf das (+)-Symbol, um einen neuen Block hinzuzufügen, wo immer die Linie sein soll.
Wählen Sie als Nächstes den Separator-Block aus dem Abschnitt Layout-Elemente aus oder suchen Sie ihn mithilfe der Suchleiste.
Nach dem Hinzufügen sehen Sie Ihren horizontalen Linienteiler in Ihrem Inhaltsbereich.
Styling der horizontalen Linie im WordPress Block Editor
Standardmäßig ist die horizontale Trennlinie eine hellgraue Linie in der Mitte Ihres Beitrags oder Ihrer Seite.
Sie können das Aussehen ändern, indem Sie auf die Linie klicken, um ihren Block auszuwählen. Dann öffnet sich das Bearbeitungsfeld „Block“ auf der rechten Seite Ihres Bildschirms.
Um den Stil Ihrer Linie zu ändern, klicken Sie einfach auf den kleinen Pfeil neben Stile. Dann sehen Sie die verschiedenen Optionen.
Sie können die horizontale Linie in eine der folgenden ändern, wenn Sie möchten:
- Eine breite Linie, die die gesamte Breite des Inhalts Ihres Beitrags abdeckt.
- Drei Punkte, die in der Mitte Ihres Beitrags angezeigt werden.
Notiz: In einigen WordPress-Themes decken sowohl die breite Linie als auch die Standardlinie die gesamte Breite deines Beitrags ab.
Sie können die Farbe Ihrer horizontalen Linie auch in den Farbeinstellungen ändern. Klicken Sie einfach auf eine der angezeigten Optionen oder verwenden Sie den Link „Benutzerdefinierte Farbe“, um eine beliebige Farbe auszuwählen.
Wenn Sie zur standardmäßigen grauen Farbe zurückkehren möchten, klicken Sie einfach auf die Schaltfläche „Löschen“ unter den Farboptionen.
Hier ist unsere horizontale Linie blau und verwendet den Stil „breit“.
Hinzufügen einer horizontalen Linie im WordPress Classic Editor
Wenn Sie noch den klassischen Editor verwenden, können Sie einfache horizontale Linien hinzufügen. Bearbeiten Sie dazu einfach einen bestehenden Beitrag oder eine Seite oder erstellen Sie einen neuen.
Wenn Sie in der Symbolleiste über dem Post-Editor nur eine Reihe von Schaltflächen sehen, klicken Sie rechts auf das Symbol zum Umschalten der Symbolleiste:
Dadurch wird die zweite Reihe von Schaltflächen geöffnet, die die Option für die horizontale Linie enthält.
Fahren Sie nun fort und setzen Sie einen Zeilenumbruch zwischen den Absätzen, wo die horizontale Linie verlaufen soll. Sie können dann auf die Schaltfläche Horizontale Linie klicken. Es ist die zweite von links in der zweiten Reihe:
Ihre horizontale Linie wird hellgrau. Es wird die gesamte Breite Ihres Beitrags wie folgt abdecken:
Manuelles Hinzufügen eines horizontalen Linienteilers mit HTML
In einigen seltenen Fällen müssen Sie möglicherweise manuell einen horizontalen Linienteiler zu Ihrem WordPress-Inhalt hinzufügen.
Wenn dies der Fall ist, können Sie dies einfach tun, indem Sie das HTML-Tag hr in Ihrem Inhalt verwenden:
Dadurch wird das horizontale Linientrennzeichen in Ihren Beitragsinhalt eingefügt.
Andere Trennzeichen, die Sie in Ihren Beiträgen und Seiten verwenden können
Mit dem standardmäßigen WordPress-Blockeditor können Sie Ihren Beiträgen und Seiten mehrere Arten von Trennzeichen hinzufügen.
Abgesehen vom horizontalen Zeilentrenner umfassen die anderen Optionen im Satz von Layoutelementen den Abstandshalter, den Link Mehr und die Seitenumbruchblöcke.
Der Abstandsblock
Mit dem Spacer können Sie Leerräume zwischen Blöcken hinzufügen. Wenn Sie beispielsweise vor einem Sonderangebot eine kleine Lücke am Ende Ihres Beitrags wünschen, können Sie den Spacer verwenden.
Sie können die Höhe des Abstandshalters anpassen. So sieht es aus, wenn Sie Ihren Beitrag im Blockeditor erstellen:
Und so wird der Spacer auf Ihrer Website angezeigt:
Der Mehr-Block
Wenn Ihr Thema vollständige Beiträge (anstelle von Auszügen) auf Ihrer Hauptseite des Blogs anzeigt, wird Ihr Beitrag an dieser Stelle durch das Hinzufügen eines „Mehr“-Links abgebrochen. Der Besucher kann klicken, um mehr zu lesen.
So sieht es aus, wenn Sie Ihren Beitrag erstellen:
Und so wird der Link Mehr auf Ihrer Website angezeigt:
Weitere Informationen zu Auszügen finden Sie in unserer Anleitung zum einfachen Anpassen von Auszügen in WordPress.
Der Seitenumbruchblock
Mit dem Seitenumbruch können Sie lange Blog-Posts auf mehrere Seiten aufteilen. Sie können es in keiner Weise anpassen. So sieht es aus, wenn Sie Ihren Beitrag erstellen:
Und so wird der Seitenumbruch auf Ihrer Website angezeigt:
All dies könnte eine gute Alternative zum Hinzufügen einer horizontalen Linie in WordPress sein, je nachdem, was Sie tun möchten.
Hinzufügen eines Seitenumbruchs in WordPress-Formularen mit WPForms
Was ist, wenn Sie nicht in einen Beitrag oder eine Seite, sondern in ein WordPress-Kontaktformular eine Pause einlegen möchten? Das können Sie auch. Wir werden dafür WPForms verwenden.
Zuerst müssen Sie das herunterladen, installieren und aktivieren WPForms-Plugin. Wenn Sie sich nicht sicher sind, wie Sie ein WordPress-Plugin installieren, lesen Sie einfach unsere Schritt-für-Schritt-Anleitung.
Als nächstes gehen Sie zu WPForms » Neu hinzufügen in Ihrem WordPress-Dashboard.
Geben Sie einen Namen für Ihr Formular ein und wählen Sie dann eine Vorlage aus. Wir werden die Vorlage „Formular zur Angebotsanfrage“ für unsere verwenden. Fahren Sie mit dem Mauszeiger über die Vorlage und klicken Sie auf die Schaltfläche, um Ihr Formular zu erstellen.
Scrollen Sie als nächstes auf der Registerkarte Felder hinzufügen auf der linken Seite nach unten zum Abschnitt Fancy Fields. Ziehen Sie den Seitenumbruch per Drag & Drop an die gewünschte Stelle im Formular. Wir platzieren es direkt vor dem Anfragefeld.
Sie werden sehen, dass das Formular jetzt in zwei Teile unterteilt ist. WPForms hat auch automatisch eine Schaltfläche „Weiter“ hinzugefügt.
Sie können das Label „Weiter“ ändern, wenn Sie möchten, und Sie können eine Schaltfläche „Zurück“ hinzufügen, um auf die zweite Seite des Formulars zu gelangen. Klicken Sie einfach auf das Seitenumbruchfeld, um es zu bearbeiten.
Speichern Sie Ihr Formular, wenn Sie fertig sind, indem Sie oben rechts auf die Schaltfläche Speichern klicken.
Sie können das Formular jetzt zu Ihrer Website hinzufügen. Zuerst müssen Sie einen neuen Beitrag oder eine neue Seite erstellen oder einen bestehenden bearbeiten.
Klicken Sie auf (+), um Ihrem Beitrag oder Ihrer Seite einen neuen Block hinzuzufügen und den WPForms-Block zu suchen. Sie können die Suchleiste verwenden oder im Abschnitt Widgets nachsehen. Fügen Sie den Block zu Ihrer Seite hinzu.
Wählen Sie nun Ihr Formular aus der Dropdown-Liste aus.
Sobald Sie dies getan haben, können Sie den Beitrag oder die Seite veröffentlichen und sehen, wie Ihr Formular auf Ihrer Website aussieht.
Wir hoffen, dass dieses Tutorial Ihnen geholfen hat, zu lernen, wie man horizontale Zeilentrenner in WordPress hinzufügt. Wenn Sie Ihren Beiträgen und Seiten weitere Design- und Layoutelemente hinzufügen möchten, lesen Sie unseren Artikel über die besten Drag-and-Drop-Seitenersteller von WordPress.