SWELLの「キャプション付きブロック」の使い方

記事上のウィジェットエリア

この記事では、SWELL専用ブロックの一つ、「キャプション付きブロック」について解説していきます。

ブロックエディターだけでなく、クラシックエディターからも同様のデザインを利用できます。

目次
目次前広告表示エリア

キャプション付きブロックとは

あるコンテンツをキャプション付きで見やすくするためのブロックのことです。

こういうのだよ

コンテンツを好きに配置できます!

キャプション付きブロックの使い方

「SWELLブロック」の中に「キャプション付きブロック」というものがあります。

SWELLブロック
SWELLブロック一覧

キャプション付きブロックを選択すると、以下のようなブロックが挿入されるので、キャプションタイトルとコンテンツを好きに編集してください。

キャプションブロック

エディター右側の「スタイル」パネルから、デザインを簡単に切り替えることができます。

キャプションブロックのスタイル選択
キャプションブロックのスタイル選択

キャプション付きブロックを使用する様子を動画で撮影しましたので、是非こちらも参考にしてみてください。

クラシックエディターでの使い方

ツールバーの「特殊パーツ」>「キャプションブロック」から簡単に挿入可能です。

キャプションボックスを選択

デザインパターン一覧

現在は6種類のデザインパターンを用意しています。

キャプションブロック

ここに好きな文章やリスト・画像などを配置できます。

キャプション(小)

ここに好きな文章やリスト・画像などを配置できます。

キャプション(枠上)

ここに好きな文章やリスト・画像などを配置できます。

キャプション(枠上2)

ここに好きな文章やリスト・画像などを配置できます。

キャプション(枠内)

ここに好きな文章やリスト・画像などを配置できます。

キャプション(浮き出し)

ここに好きな文章やリスト・画像などを配置できます。

カラーセットも3種類登録可能!

キャプション付きブロックのサイドバーに、以下のようなカラーパネルが設置されています。

これらを選択することで、以下のような色のついたキャプション付きブロックが利用できます。

オレンジだよ

「デフォルト」スタイル & オレンジだよ

ブルーだよ

「小」スタイル & ブルーだよ

グリーンだよ

「枠内」スタイル & グリーンだよ

カラーセットのカスタマイズ方法

この3色のカラーセットは、「SWELL設定」>「エディター設定」の「カラーセット」タブから好きな色にカスタマイズ可能です。

カラーセット設定エリア
記事下のウィジェットエリア

この記事が気に入ったら
フォローしてね!

目次
閉じる