Wie kann ich eine Überschrift in WordPress zentrieren?
- Einleitung: Warum Überschriften in WordPress zentrieren?
- Zentrierung von Überschriften über den Block-Editor (Gutenberg)
- Zentrierung mit klassischen Editor und HTML/CSS
- Zentrierung durch eigenes CSS im Theme oder Customizer
- Fazit
Einleitung: Warum Überschriften in WordPress zentrieren?
Überschriften sind ein wichtiger Bestandteil jeder Webseite, da sie Struktur schaffen und Benutzer durch den Inhalt führen. In WordPress können Überschriften standardmäßig linksbündig dargestellt werden. Allerdings kann es aus gestalterischen Gründen sinnvoll sein, die Überschriften zu zentrieren, etwa um den Fokus auf wichtige Titel zu lenken oder ein harmonischeres Layout zu erzeugen. In diesem Beitrag erfahren Sie, wie Sie eine Überschrift in WordPress zentrieren können.
Zentrierung von Überschriften über den Block-Editor (Gutenberg)
Seit der Einführung des Gutenberg-Editors in WordPress ist das Anpassen von Textausrichtungen deutlich einfacher geworden. Wenn Sie eine Überschrift im Editor zentrieren möchten, klicken Sie einfach auf den betreffenden Überschriftenblock. In der Toolbar, die oberhalb des Blocks erscheint, finden Sie die Ausrichtungsoptionen. Dort können Sie zwischen linksbündig, zentriert und rechtsbündig wählen. Ein Klick auf das Symbol für die Zentrierung bringt die Überschrift sofort in die Mitte.
Diese Methode ist besonders benutzerfreundlich und erfordert keine Programmierkenntnisse. Zudem wird die Zentrierung nur für den jeweiligen Block angewendet, was Ihnen volle Kontrolle über das Layout gibt.
Zentrierung mit klassischen Editor und HTML/CSS
Wenn Sie noch den klassischen Editor verwenden oder mehr Kontrolle über das Design Ihrer Webseite wünschen, können Sie die Überschrift auch manuell mit CSS zentrieren. Dazu haben Sie verschiedene Möglichkeiten:
Eine einfache Variante besteht darin, innerhalb des Text-Editors der WordPress-Seite oder des Beitrags ein zentriertes HTML-Element zu verwenden. Beispielsweise können Sie Ihre Überschrift in einem <h2>-Tag mit dem Attribut style="text-align:center;" versehen. Das sieht dann so aus:
<h2 style="text-align:center;">Meine zentrierte Überschrift</h2>Dadurch wird die Überschrift direkt im Inhalt zentriert, ohne zusätzliche Anpassungen.
Zentrierung durch eigenes CSS im Theme oder Customizer
Für eine dauerhafte Lösung oder wenn Sie mehrere Überschriften zentral ausrichten möchten, ist das Hinzufügen von CSS sinnvoll. Dies können Sie entweder in der style.css Ihres aktiven Themes tun oder über den WordPress-Customizer unter dem Menüpunkt Zusätzliches CSS. Ein Beispiel für eine CSS-Regel, die alle Überschriften einer bestimmten Klasse zentriert, wäre:
.heading-center { text-align: center;}Sie können dann Ihre Überschrift im Editor mit dieser Klasse versehen:
<h2 class="heading-center">Überschrift zentrieren mit CSS</h2>Dies gibt Ihnen die Flexibilität, mehrere Überschriften zentral auszurichten und die Gestaltung zentral an einem Ort zu steuern.
Fazit
Die Zentrierung von Überschriften in WordPress ist unkompliziert und kann je nach genutztem Editor oder gewünschtem Grad der Individualisierung auf verschiedene Arten erfolgen. Im Gutenberg-Editor ist die Ausrichtung per Knopfdruck möglich, während klassische Editoren oder individuelle Designs mit Inline-Styles oder eigenem CSS angepasst werden können. So lassen sich Überschriften ansprechend und passend zum Gesamtlayout zentrieren.