カラムブロック

ブロック一覧へ戻る

カラムブロックを使用すると、テキスト、メディア、その他の種類のコンテンツを最大3カラムまで挿入できます。連続して使用すると、カラムはグリッド効果を生み出します。

空のブロックへ /columns (または /カラム)と入力して Enter キーを押す方法でも、簡単に追加できます。

ブロック追加の詳しい方法はこちらをご覧ください。

カラムブロックを追加した後、最初のパターンを選びます(カラム数を変えたり、後からカラムを追加したりできます)。デフォルトのパターン(50 / 50)で良ければスキップオプションをクリックします。

カラムブロックの編集

カラムを追加または削除できます。追加するには、ボックスとサイドバーの間(ボックスの外側)をクリックしてから、カラムを追加アイコンをクリックします。または、カラムブロックのサイドバーのブロック設定にあるカラムパネルを使って、カラム数を変更します(最大6カラム)。

コンテンツの追加

カラム数を定義したら、各カラムにコンテンツを追加します。カラムブロックの優れた点は、各カラムに他のブロックを追加できることです。

例えば、カラムブロックを構造として使用し、画像ブロック、見出しブロック、段落ブロックを追加してサービスのグリッドを作成できます。

または、カラムブロックとカバーブロックを使用して、サイトの機能ページを作成できます。

また、カラムブロックとボタンブロックを使用して、サイトで何らかの操作をするようユーザーを促すこともできます。

ご存知のことと思いますが、可能性は無限にあります。こんなことができる、というのをご覧になってみませんか。ぜひ動画でご確認ください。

ブロックツールバー

各ブロックにはそれ固有のツールバーアイコンとコントロールがあり、エディター内でブロックを操作できます。

カラムブロックには標準で5個のボタンがあります。

• 変換またはスタイル変更
• 移動用ハンドル
• 配置を変更
• 垂直配置を変更
• 他のオプション

変換またはスタイル変更

カラムブロックはグループ、または入れ子になったカラム(一つのカラムに独立したカラムブロックが入る)へ変換できます。グループを使うとカラムブロックの周囲の背景色を変更できます。

他に、カラムブロックのスタイルをデフォルトと重ね合わせの2種類から選べます。重ね合わせを選ぶと、隣り合わせのカラムが少し重なって表示されます。

移動用ハンドル

上下の矢印を使って、ドキュメント内でブロックを上下に移動できます。

エディター内でブロックを移動する詳しい方法はこちらをご覧ください。

配置を変更

• 幅広 – ブロックの幅をコンテンツ幅に合わせます。
• 全幅 – 画面の幅いっぱいまでブロックの幅を広げます。

垂直配置を変更

カラムの垂直配置を指定できます。高さが異なるカラムが混在する場合に役立ちます。

• 上揃え – カラムブロックの上に揃えます。
• 中央揃え – カラムブロックの垂直方向の中央に揃えます。
• 下揃え – カラムブロックの下に揃えます。

他のオプション

追加設定を表示(非表示)

追加設定を表示(非表示)オプションを使うと、エディターのサイドバーにあるブロック設定パネルを表示する(または隠す)ことができます。

コピー

コピーを使うと、選択したブロックをコピーしてエディター内の好きな位置へ貼り付けできます。

複製

複製を使うと、選択したブロックを複製できます。

前に挿入

新しいブロックを選択したブロックの前へ挿入します。

後に挿入

新しいブロックを選択したブロックの後へ挿入します。

移動

移動を選ぶと、コンテンツ内に青い線が現れます。その後、矢印を使って線を上下に移動し、選択したブロックの移動先を指定できます。最後にキーボードの Enter を押すとブロックがそこへ移動します。

再利用ブロックに追加

再利用ブロックに追加オプションを使うと、選択したブロックを再利用ブロックのリストへ追加できます。すると他の投稿や固定ページでそのブロックを利用できます。

グループ化

ブロックをまとめて一つの単位として扱いたい場合、グループ化オプションを選択します。例えば共通の背景色や他のブロックをグループへ追加できます。

ブロックを削除

ブロックを削除オプションを使うと、選択したブロックをコンテンツから削除できます。

トップ ↑

ブロック設定

どのブロックも、ブロックツールバーにあるオプションに加えて、固有のオプションがエディターのサイドバーにあります。もしサイドバーが見当たらなければ、公開(更新)ボタンの隣にある「歯車」ボタンをクリックしてください。

スタイル

• デフォルト – カラムとカラムの間を少し開けます。
• 重ね合わせ – 隣り合わせのカラムを少し重ねて表示します。

色

テキスト色オプションは、テキストの色を変更できます。

背景色オプションは、背景色を変更できます。また単色かグラデーションかを選べます。グラデーションの場合、線形か放射状かを選べます。さらに線形の場合は角度を指定します。

カラム

カラムブロックの編集セクションで説明したように、ブロック設定サイドバーでカラム数を設定できます(最大6カラム)。

カラム数を編集するには、上下の矢印をクリックするか、スライダーを左右にドラッグするか、フィールドに直接数字を入力します。

高度な設定

サイドバーのブロック設定の高度な設定パネルには、HTML アンカーと追加 CSS クラスのオプションがあります。

HTML アンカーは特定のカラムブロックにユニークな Web アドレスを作ることができます。その後、ページ内のカラムブロックへ直接リンクできます。

追加 CSS クラスはブロックへ CSS クラスを追加できます。その後、カスタム CSS を書いてブロックに好みのスタイルを付けることができます。