So erstellen Sie Spalten in WordPress ohne Plugin

So erstellen Sie Spalten in WordPress ohne Plugin

Dank des WordPress-Spaltenblocks ist das Organisieren von Inhalten in Spalten ein Kinderspiel. Dieser Block gehört zu den Kernblöcken, die in jedem WP-Theme verwendet werden können. Der Spaltenblock kann bis zu 6 Spalten haben. Sie können also 6 verschiedene Inhalte nebeneinander haben.

Heute zeigen wir Ihnen, wie Sie in WordPress Spalten ohne Plugin erstellen – mithilfe des Columns-Blocks. Wir bringen Ihnen auch eine Zusammenfassung von Neueste Funktionen aus der WP 5.3-Version aktualisieren.

In diesem Tutorial finden Sie Informationen zu:

Was ist der Zweck von Spalten?

Spalten auf einer Website können mehrfach verwendet werden. Erstens können sie Inhalte übersichtlicher, lesbarer und leichter durchsuchbar machen. Durch die Organisation von Inhalten in Spalten können Sie wichtige Informationen oder Parameter hervorheben.

Sie können beispielsweise ein mehrspaltiges Layout verwenden, um Ihre Dienste darzustellen. Fügen Sie dort ein illustratives Bild, eine Beschreibung oder eine Schaltfläche hinzu. Sie können das Bild natürlich anklickbar machen.

Mehrspaltiges Layout mit Diensten
Mehrspaltiges Layout mit Diensten

Ähnlich wie bei Diensten können Sie in WordPress Spalten verwenden, um Produkte oder Produktkategorien anzuzeigen. Es ist ideal, wenn Sie eine einfache Unternehmenswebsite haben.

Mehrspaltiges Layout mit Produkten und Kategorien
Spalten zur Anzeige von Produkten und Kategorien

In Blogbeiträgen können Sie Spalten verwenden, um Inhalte zu trennen. Sie können Text, Aufzählungspunkte oder Bilder nebeneinander platzieren.

Getrennter Inhalt durch Spalten
Verwenden von Spalten zum Trennen von Inhalten

So funktionierten Spalten im alten Editor

Wenn Sie vor WordPress 5+ mehrspaltigen Inhalt erstellen wollten, mussten Sie Tabellen verwenden. Es war viel schwieriger als im neuesten Editor. Darüber hinaus gab es in der Regel ein Problem mit Stilen und der Darstellung von Tabellen auf Mobilgeräten. Wie hat es früher funktioniert?

Sie hatten mehrere Möglichkeiten, Spalten auf einer WordPress-Website zu erstellen:

1. Fügen Sie HTML-Code manuell in den Texteditor ein

<table>
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>

Dieser Ansatz wurde hauptsächlich von Entwicklern verwendet, die schnell Tabellen oder Spalten basierend auf ihren Anforderungen erstellen konnten. Der Nachteil war, dass nicht alle WordPress-Themes gut mit Spalten umgehen konnten. Tabellen waren normalerweise nicht perfekt und der durchschnittliche Benutzer konnte nicht alle möglichen Probleme einfach lösen.

2. Tabellen im WordPress-Editor zulassen

Da WordPress den TinyMCE-Editor verwendet, war es möglich, Funktionen zum Bearbeiten von Tabellen zuzulassen. Wenn Sie mehr erfahren möchten, finden Sie hier alle Details in diesem Forum. Wenn Sie dasselbe für unsere AIT-Themes tun, funktionieren die Tabellen korrekt.

3. Verwendung des Columns-Elements in AIT-Themen

Wenn Sie eines unserer älteren WordPress-Themes verwenden, kennen Sie sicherlich unser Columns-Element. Mit diesem Element können Spalten innerhalb von Seiten hinzugefügt werden. Es handelt sich um ein bestellbares Element, das heißt, Sie können es überall dort platzieren, wo Sie es benötigen. Der Vorteil liegt in der Variabilität innerhalb der Seiten.

Spaltenelement
Bestellbare Elementspalten – Sie können es in jedem AIT-Theme verwenden

4. Laden Sie das Plugin eines Drittanbieters herunter, um Tabellen zu verwalten

Eine weitere Lösung zum Erstellen von Spalten in WordPress-Beiträgen und -Seiten bestand darin, eines der verfügbaren Plugins zum Erstellen von Tabellen herunterzuladen. Diese Plugins ermöglichen das Hinzufügen von Spalten/Tabellen mit wenigen Klicks und ohne Programmieraufwand. Dies war auch für weniger erfahrene Benutzer möglich.

So erstellen Sie Spalten in WordPress ohne Plugin (im Blockeditor)

Dank des neuen Blockeditors ist das Erstellen von Spalten extrem einfach geworden. Wenn Sie noch altes WordPress verwenden, ist jetzt der richtige Zeitpunkt für ein Update auf die neueste Version. Mit dem Spaltenblock können Sie Spalten einfach und mit wenigen Klicks hinzufügen und verwalten.

Dieser Block ist eine willkommene Abwechslung für alle, die mit mehrspaltigen Inhalten arbeiten, Produkte präsentieren oder Blogs schreiben möchten und keine Erfahrung mit Programmierung haben.

Schauen wir uns an, wie man den Columns-Block hinzufügt und wie man Spalten in WordPress ohne Plugin erstellt:

  • Die erste Möglichkeit besteht darin, in der oberen Leiste auf „+“ zu klicken und aus den verfügbaren Blöcken den Block „Spalten“ auszuwählen.
  • Die zweite Möglichkeit besteht darin, irgendwo im Editor auf „+“ zu klicken.
Fügen Sie Spalten in WordPress hinzu, indem Sie auf „+“ klicken.
Spalten in WordPress hinzufügen, indem Sie auf „+“ klicken
Spaltenblock mit Schrägstrich „/“ hinzufügen
Spalten in WordPress mit Schrägstrich „/“ hinzufügen

Vordefinierte Layouts des WordPress-Spaltenblocks (NEU ab WP 5.3)

Die neueste Version brachte enorme Verbesserungen bei den Spalteneinstellungen. Zunächst einmal stehen Standard-Layoutstile zur Verfügung. Was bedeutet das?

Benutzer können beim Hinzufügen eines neuen Blocks zum Inhaltsbereich ihr Layout und ihren Ausrichtungsstil auswählen. Vordefinierte Layouts können sehr hilfreich sein – insbesondere für Benutzer, die nicht über fortgeschrittene WordPress-Kenntnisse verfügen. Diese Funktion stellt dar, wie wir uns die Art und Weise vorstellen, wie man Spalten in WordPress erstellt (ohne Plugin oder andere Add-Ons).

Vordefinierte Layouts im Spaltenblock
Vordefinierte Layoutoptionen

 

Wenn Sie im WordPress-Spaltenblock kein vordefiniertes Layout auswählen möchten, überspringen Sie es einfach. Nachdem Sie diesen Schritt übersprungen haben, wird der Inhalt in zwei gleiche Teile/zwei einzelne Spalten aufgeteilt, die bearbeitet werden können.

Erstellter Spaltenblock
Spaltenblock mit 2 Standardbereichen (Spalten), die Sie bearbeiten können

Spalten Blockieren Sie Grundeinstellungen

Der WordPress-Spaltenblock selbst bietet nicht viele Optionen. Warum das so ist, erklären wir später. In der oberen Leiste können Sie die Ausrichtung auf „Breit“ oder „Volle Breite“ ändern. Sie können diese Ausrichtung ändern, wenn sie von Ihrem aktiven Theme unterstützt wird.

Obere Symbolleiste des Spaltenblocks
Obere Symbolleiste mit Ausrichtungsoptionen

Die wichtigste Einstellung des Spaltenblocks ist die Anzahl der Spalten in der Inspektor-Seitenleiste auf der rechten Seite. Standardmäßig gibt es 2 Spalten, aber Sie können diese Zahl auf 6 erhöhen. Sie können sie mit der Maus ändern oder eine Zahl eingeben. Wie es aussieht, sehen Sie sofort, nachdem Sie die Spalten vergrößert oder verkleinert haben. Der Block ändert sich je nach Schieberegler dynamisch.

Anzahl der Spalten ändern
Bewegen Sie den Schieberegler, um die Anzahl der Spalten nach Bedarf zu ändern

Dies ist sehr praktisch, da Sie die Anzahl der Spalten buchstäblich in Sekundenschnelle ändern können, ohne dass schwierige Änderungen an den Einstellungen oder der Codierung erforderlich sind.

Ähnlich wie bei anderen Blöcken im WordPress-Editor können Sie auch im Spaltenblock eine benutzerdefinierte CSS-Klasse einfügen.

Block-Appender für reibungsloseres Arbeiten mit Blöcken

Der Spaltenblock ist etwas Besonderes, da Sie damit mehrere Blöcke erstellen können. Bis zur Veröffentlichung der neuen Version war es ziemlich schwierig, mit einzelnen Blöcken zu arbeiten. Als Sie einen Block hinzufügen wollten, wussten Sie nicht genau, wo Sie klicken sollten. Dank des Block-Appenders (und seiner Unterscheidung nach Hintergrundfarbe) ist es einfacher, Inhalte in die richtige Spalte einzufügen.

Appender im WordPress-Spaltenblock blockieren
Appender mit Hintergrundfarbe blockieren

So arbeiten Sie mit dem WordPress-Spaltenblock

Das Schöne am Columns-Block ist, dass jede Spalte andere Blöcke verschachteln kann. Es kann sich um einen Absatz, einen Bildblock oder einen Schaltflächenblock handeln. Die maximale Anzahl der Spalten beträgt 6. Sie können daher nach Bedarf mehrspaltige Inhalte erstellen. Wie bereits erwähnt, können Sie zur Präsentation von Produkten Produktbild, Name, Preis und Schaltfläche nebeneinander hinzufügen.

Verschiedene Arten von Inhalten im mehrspaltigen Layout
Mit dem Spaltenblock können Sie verschiedene Arten von Inhalten nebeneinander präsentieren

Sie können auch mehrere Säulenblöcke untereinander verwenden, um ein Raster zu erstellen. Sie können damit Ihre Dienstleistungen präsentieren oder wichtige Funktionen bewerben.

Spalten blockieren den Rastereffekt
Rastereffekt von untereinander platzierten Spaltenblöcken

Bearbeiten verschachtelter Blöcke

Wie bereits erwähnt, können Sie andere Blöcke in Spalten verschachteln. Für jeden verschachtelten Block sind alle Einstellungen verfügbar. Das heißt, wenn Sie einen Bildblock zu einer Spalte hinzufügen, können Sie ihn genauso bearbeiten wie im Standalone-Modus Bildblock.

Bildblock als verschachtelten Block bearbeiten
Verfügbare Einstellungen für den im Spaltenblock verschachtelten Bildblock

Fazit: Säulen blockieren Vorteile

Durch die Veröffentlichung des WordPress-Blockeditors und die Möglichkeit, Spalten in Seiten und Beiträgen zu verwenden, wurde die Art und Weise, wie Benutzer mit Inhalten arbeiten können, erheblich vereinfacht. Dank des WordPress Columns-Blocks ist es nicht mehr wichtig, Lösungen von Drittanbietern zu verwenden oder HTML-Code zu schreiben. Das Hinzufügen oder Löschen von Spalten ist mit wenigen Klicks möglich. Alles ist sehr intuitiv und schnell, auch für weniger technisch versierte Benutzer.

Ihr Inhalt im mehrspaltigen Layout wird gut im Raster ausgerichtet. Auch in der responsiven Version sieht es sofort gut aus.

Wir haben hart an dem neuen Citadela-WordPress-Theme gearbeitet, das speziell für den WordPress-Blockeditor entwickelt wurde. Erfahren Sie mehr über das Citadela-Theme und die verfügbaren Layoutpakete.

2 Gedanken zu „How to make columns in WordPress without plugin

    1. Hallo David,

      Vielen Dank fürs Schreiben. Sie sollten den Gutenberg-Editor aktivieren, der die Möglichkeit bietet, die einzelne Spalte auszuwählen. In der Seitenleiste „Einstellungen“ (rechte Seite) können Sie deren Breite anpassen.

      Mit freundlichen Grüßen!
      Zlatko
      AIT-Team

Kommentare sind geschlossen.