WordPress 標準ブロックのスタイル・機能拡張

見出し、リスト、画像、グループなど WordPress 標準のブロックに対して、VK Blocks 独自の装飾スタイルや機能を追加しています。無料版の VK Blocks および VK Blocks Pro で利用できます。

検索ブロック

検索

検索

検索

検索

検索

見出しブロック

※見出しブロックの装飾（線の色など）については、現状は色を指定できません。

装飾なし

背景塗り 灰色

二重線 上下線 黒

二重線 下線 黒

直線 上下線 黒

直線 下線 黒

点線 下線 黒

左右線

括弧 黒

簡単にコピペして使える見出しのブロックパターンもあります。VK Blocks 無料版の場合は、以下よりご確認ください。

VK Blocks Pro の場合は以下よりご確認ください。

リストブロック

グループブロック

VK Blocks 独自の装飾スタイルもありますが、ブロックテーマ X-T9 や、theme.json が有効な Lightning などの場合、WordPress の機能で線の色や背景色、余白などが設定可能です。

VK Blocks 独自の装飾スタイルは以下です。

ブロック全体にリンクの設定

ブロックツールバーの「リンクURL」にて、グループブロック全体にリンクの設定ができます。

カバーブロック

ブロック全体にリンクの設定

ブロックツールバーの「リンクURL」にて、カバーブロック全体にリンクの設定ができます。

画像ブロック

カラムブロック

カラムごとにリンク設定

カラムごとにリンクを設定できます。親のカラムブロックの中のカラムを選択し、ブロックツールバーの「リンクURL」にて設定が可能です。たとえば下記画像では、カラム01、02、03 それぞれにリンクを設定できます。

カラムの表示順

親のカラムブロックにて「カラムの方向」で「逆」をオンにすると、カラムの表示順が左右逆（HTML上とは逆）になります。

「逆」を適用すると、編集画面ではカラムブロックの右上に「Reverse」のラベルが表示され、「カラムの方向」のVKのアイコンが黒く反転します。設定していることが視覚的に分かるようにしてあります。

また、カラムブロックの設定項目である「モバイルでは縦に並べる」がオンの状態であれば、スマホで表示したときに上から表示されます。

下のカラムブロックは、カラムの方向を逆に設定しています。そのため、スマホで表示したときに1→2の順で表示されます。

カラムの方向：逆（オン）

スマホで表示すると、Lightning の画像が上に表示されます。

カラムの方向：逆（オフ）

スマホで表示すると、見出しとテキストが上に表示されます。

テーブルブロック

水平方向のスクロールが可能です。

「テーブルの水平方向スクロール」で「スクロール」を有効にすると、ブレイクポイント（モバイル / タブレット / PC ）を選べます。テーブルのレイアウトをスマホとPCで変えたくないときなどにご活用ください。

また、「スクロールメッセージを表示」を有効にすると、テーブルの上部右側にメッセージが表示されます。メッセージの内容は編集可能です。

さらに、メッセージの前後に表示される Font Awesome のアイコンは、お好みのものに変更できます。