SWELLでボーダーやスタイルの中にリストや画像等を入れる方法【グループ化】

2021年10月8日

当ページのリンクには広告が含まれています。

こんにちは、わえ（@wae_lib）です！

SWELLでは、ブロックエディタの右側の「ブロック」タブでボーダーやスタイルを簡単に設定できて便利ですよね。

でも、好きなボーダーやスタイルを選択してそのまま使おうとしたら、中にリストや画像を入れられなくて、困っていませんか。

そのままではリストや画像を挿入できない！！

この記事では、ボーダーやスタイル内にリストや画像などを入れる方法について解説します。

グループ化を使ってボーダーやスタイル内にリストや画像などを入れる

まずはボーダーやスタイルで囲いたいリストや画像などのボックスを作りましょう。

リストの場合で説明します。

作ったリストボックスを選択して、ツールバーを表示させます。一番右のボタンを押して、「グループ化」をクリックします。

すると、リストボックスが点々の四角で囲まれます。

この状態で、右側の「ブロック」タブでボーダー設定やスタイルの選択ができます。たとえば「チェック」のスタイルを選択すると、次のようになります。

画像も同様の手続きでスタイルなどで囲えます。

グループ化の機能を使えば、リストや画像、ボタンなど、さまざまなボックスをまとめてスタイルなどで囲うこともできます。

リスト、画像、ボタンをまとめて囲うには、まずそれぞれ別々に作っておいて、すべて選択して「グループ化」を押します。

あとは好きなボーダーやスタイルを選んで、全体を囲います。

最後までお読みいただきありがとうございます！

この記事では、SWELLでリストや画像などをボーダーやスタイルで囲う方法について解説しました。

SWELLを使い始めたばかりでは、小さなことでもわからないことがありますよね。

少しずつ覚えて、より良い記事作成を目指しましょう。