WordPressで複数の列を追加する方法（2つの方法）

コンテンツを列に配置する方法は、印刷機の初期の頃にまでさかのぼります。 この形式は、テキストや画像などを整理するための用途の広い方法です。 ただし、WordPressに複数の列を追加し、それらを正しく配置するのは少し難しい場合があります。

幸いなことに、そうである必要はありません。 これで、ブロックエディターを使用して、いくつかの短い手順でWordPressの投稿やページに複数の列を簡単に追加できます。

クラシックエディタとページビルダープラグインを使用して、このレイアウトを実現することもできます。

このチュートリアルでは、WordPressで複数の列を追加する方法を調べます。

始めましょう！

複数列のレイアウトを使用する理由

適切なテーマの選択からカスタムフォントの追加まで、サイトのデザインをパーソナライズすることは、ブランドを確立するために重要です。 あなたの投稿とページのレイアウトもこのパズルの一部です。 さまざまなフォーマットオプションを試すことは、コンテンツに構造的な多様性を追加するための興味深い方法です。

読みやすさに最適な単一の形式はないため、創造性を発揮して、自分に合った外観を見つけることができます。 次のデモのように、さまざまな種類のコンテンツに合わせてページからページに切り替えて、さまざまなレイアウトのページで構成されるWordPressサイトを作成できます。

列は特に用途の広い形式です。 スペースを経済的に使用したい場合は、テキストを簡単にセグメント化できます。

BuddyBossテーマが示すように、列を使用して、さまざまなウィジェットをまとまりのある方法でペアにすることもできます。

または、必要に応じて削除または再形成できる柔軟な形式を使用することに興味があるかもしれません。 あなたの理由に関係なく、列はあなたのサイトにいくつかの多様性と組織を加えることができます。

WordPressで複数の列を追加する方法（2つの簡単な方法）

WordPressの初期の頃、ユーザーはHTMLの実用的な知識を持ち、自信を持ってコードを編集して投稿に列を追加できる必要がありました。 当時、コンテンツの作成と編集は最もユーザーフレンドリーなエクスペリエンスではありませんでした。

幸い、WordPressに列を追加する簡単な方法が2つあります。HTMLは必要ありません。

ブロックエディターには直感的な組み込みの列機能が付属しており、クラシックエディターを好む人は、プラグインを使用して列を手動でコーディングすることを回避できると聞いて喜ぶでしょう。

それでは、2つの方法を見てみましょう。

方法1：ブロックエディタのネイティブ機能を使用する

ブロックエディタ（Gutenberg）を使用して複数の列を追加することから始めます。 新しいデフォルトのWordPressコンテンツ作成インターフェースは、移動しやすいコンテンツブロックに焦点を合わせた便利な機能をすべて提供します。

これらの機能の1つは、適切な名前のColumnsブロックです。これは、必要な数の列を作成するのに役立ちます。

開始するには、[+]ボタンをクリックして開くことができるブロックエディタの検索ボックスに「列」と入力します。 または、画面をクリックして「/ columns」と入力し始めると、同じオプションが表示されます。

これにより、列レイアウトを選択できるウィンドウが呼び出されます。

デフォルトの2列から始めて、後で設定を調整することもオプションです。

必要なセクションの数とそれらを分割する方法を指定したら、ブロックを好きな場所にドラッグアンドドロップできます。

次に、Columnsブロック内に他のブロックをネストできます。 それらはすべてテキストブロックである可能性があります、またはあなたはそれを揺るがすことができます。 テキスト列を画像またはカレンダー列の横に配置して目立たせるようにして、テキスト列を拡張してみてください。

要素を組み合わせて一致させることにより、エディターの柔軟性を利用することを恐れないでください。

その後、[列]ブロックの設定に戻り、必要に応じて幅の比率を微調整できます。 個々の列は、撮影する外観の種類に応じて調整できます。

ブロックエディタのビジュアルインターフェイスのおかげで、バックエンドでの作業はフロントエンドに直接変換されます。 参考までに、公開後の例は次のようになります。

基本のコツをつかんだら、コラムを使ってさらに探索することができます。

ブロックエディタでより多くの機能を探している場合は、機能を強化するブロックプラグインをダウンロードして、新しいコンテンツの組み合わせを試すことを検討してください。

方法2：SiteOriginのクラシックエディターとページビルダーを使用する

伝統主義者でありながらクラシックエディタを使用している場合は、コードなしで投稿やページに複数の列を追加することもできます。 必要なのはプラグインだけです。 仕事を成し遂げることができる多くのオプションがあるので、あなたがする必要がある最初のことは1つを選ぶことです。

私はPageBuilder by SiteOriginプラグインの大ファンなので、これを使用してクラシックエディターで複数列のレイアウトを作成します。

Page Builderは、直感的なドラッグアンドドロップインターフェイスを利用する堅実な無料オプションであり、100万を超えるアクティブなインストールがあります。

プラグインをサイトにインストールしてアクティブ化したら、左側のサイドバーの[設定]> [ページビルダー]メニューをクリックして、その設定ページに移動します。

ここで、[全般]タブを選択し、[新しい投稿にクラシックエディターを使用する]オプションをオンにします。

このオプションを機能させるには、サイトにClassicEditorプラグインをインストールしてアクティブ化する必要もあることに注意してください。

これで、既存の投稿を開くか、新しい投稿を作成して右上隅の[ページビルダー]タブに移動することで、列を追加できます。

ここで、[行の追加]ボタンをクリックして、列を追加できる新しい行を作成します。

これにより、列の数、比率、方向など、いくつかの初期設定を調整できるインターフェイスが開きます。

列の数を指定し、それらの比率を決定します。 次に、[挿入]をクリックして投稿に配置します。

ブロックエディタと同様に、SiteOriginプラグインによるページビルダーを使用すると、列構造にさまざまなウィジェットを挿入できます。

ウィジェットを追加する列を選択し、[ウィジェットの追加]ボタンをクリックすると、次のパネルが表示されます。

組み込む要素を選択し、コンテンツを入力します。

投稿のバックエンドは次のようになります。

変更を確定します。

これは、次のようなフロントエンドの結果に変換されます。

さまざまなウィジェットの組み合わせを試して、サイトの独自の外観を実現してください。 これはいつでも元に戻すことができる簡単なプロセスなので、型を破って創造性を発揮することを恐れないでください。

結論

WordPressサイトに列を追加すると、レイアウトを新鮮で魅力的なものに保つのに役立ちます。 そうするプロセスは時々少し難しいかもしれませんが、それを簡単にするために使用できる簡単な方法があります。

このチュートリアルでは、WordPressで複数の列を追加するための2つのステップバイステップの方法について説明しました。

1. ブロックエディタの組み込みのColumnsブロックを使用する
2. クラシックエディタで使用するためのPageBuilderなどのプラグインのインストール

WordPressで列を追加するためのお気に入りの方法は何ですか？ 以下のコメントセクションでお知らせください。