【SWELL非公式マニュアル】装飾ボックスの使い方

この記事では、SWELLのエディターで使用できるボックス装飾機能について紹介します。

ブロックエディターでは、段落ブロックとグループブロックでほぼ同じ装飾が使うことができます。

シンプルな装飾

ここご紹介する「シンプルな装飾」については、SWELL ver 2.0.5 からブロックエディターでは廃止されました。

代わりに、「色設定」パネルから好きな背景色を設定したり、「ボーダー設定」パネルから４種類のボーダースタイルを選択できるようになっています。

カラーパレット & ボーダー設定は、「SWELL設定」＞「エディター設定」からカスタマイズ可能です。

1.青い枠線がついたボックス

2.黒い枠線がついたボックス

3.赤い枠線がついたボックス

4.グレー枠線がついたボックス

5.濃い背景色（メインカラーに依存します）

6.薄い背景色（メインカラーに依存します）

7.薄いグレーの背景色

8. 薄いグレーストライプの背景色

アクセントの効いた装飾

1.ストライプ

2.方眼

3.角に折り目

4.スティッチ

5.かぎ括弧

6.かぎ括弧（大）

7.窪み

8.浮き出し

9.左に縦線

10.付箋

11.吹き出し

12.吹き出し２

アイコン付きボックス（小）

1.グッドアイコン

2.バッドアイコン

3.インフォアイコン

4.アナウンスアイコン

5.えんぴつアイコン

6.本アイコン

アイコン付きボックス（大）

1.電球アイコン

2.チェックアイコン

3.バツ印アイコン

4.はてなアイコン

5.アラートアイコン

6.メモアイコン

「アイコンボックス（大）」の見た目は、「SWELL設定」＞「エディター設定」内の「アイコンボックス」タブから以下のように変更もできます。

装飾ボックスの使い方

ここまで紹介してきた装飾ボックスの使い方を説明します。

ブロックエディターでの使い方

エディター右側のサイドバーにある「スタイル」タブから、使用したいスタイルをクリックするだけです。

「段落ブロック」と「グループブロック」で使用可能です。

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

ツールバーの二段目、一番左にある「スタイル」というセレクトメニューから、挿入したい装飾ボックスの名前を選択して下さい。

装飾ボックスは「シンプルボックス」・「効果付きボックス」・「アイコン付きボックス（小）」・「アイコン付きボックス（大）」の4種類に分かれています。

SWELL公式マニュアル：SWELLで使える「ボックス装飾」一覧