【AFFINGER6ブロックエディタ使い方3】メモ、ボックス類
![](https://chironeko.com/wp-content/uploads/2021/07/affinger6-logo-16-9.jpg)
この記事では、AFFINGER6の「ボタン」ブロックと「ボックス類」について解説します。
- STINGER: メモ
- STINGER: マイボックス
- STINGER: 見出し付きフリーボックス
- STINGER: バナー風ボックス
ボックスの使い分け方法や、便利なアイコン一覧表(ダウンロード可能)などをご紹介します。
![](https://chironeko.com/wp-content/uploads/2020/11/593096.jpeg)
ダウンロード可能なアイコンリストもご紹介しています!
STINGERメモ|AFFINGER6ブロックエディタ
![AFFINGER6独自ブロックで「STINGER:メモ」を選択](https://chironeko.com/wp-content/uploads/2021/08/AFFINGER6-icon1.jpg)
AFFINGER6の独自ブロックである「STINGERメモ」 の使い方について説明します。
「STINGERメモ」と「段落」の違い
「 STINGER: メモ」ブロックは「段落」ブロックとよく似ています。
![AFFINGER6の「STINGER:メモ」と「段落」ブロック比較サンプル](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-1.jpg)
「STINGER: メモ」ブロックは、一見すると「段落」ブロックと装飾はほとんど変わりません。
そのため、「文字だけ」を入れる場合は、設定が簡単な「段落」ブロックを使用すると良いでしょう。
一方、「STINGER: メモ」ブロックを使うメリットは、他のブロックを含むことができる点です(下図参照)。
![AFFINGER6の「STINGER:メモ」と「段落」ブロック比較サンプル2](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-2.jpg)
「STINGER: メモ」ブロックは、以下の点が「段落」ブロックと異なります。
- 他のブロックを入れられる。
- アイコンの大きさを変えられる
- 背景色や文字色を自由に変えられる。
ブロック内に他の装飾を入れたい場合は、「STINGER:メモ」を使用します。
「STINGERメモ」の設定
下記は、「STINGER: メモ」ブロックの設定項目です。
![AFFINGER6の「STINGER:メモ」ブロックの設定項目](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-4.jpg)
メモの背景色を設定したり、アイコンを設定したりできます。
アイコンは文字ベースで選択するので、直感的に分かりずらいことがあります。
![AFFINGER6の「STINGER:メモ」ブロックのアイコン選択画面](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-5.jpg)
下記のリストをダウンロードしてプリントしておくと便利です。
![AFFINGER6の「STINGER:メモ」ブロックのアイコン全種類](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-3-1.jpg)
マイボックス|AFFINGER6ブロックエディタ
![AFFINGER6独自ブロックで「STINGER:マイボックス」を選択](https://chironeko.com/wp-content/uploads/2021/08/AFFINGER6-icon2.jpg)
AFFINGER6の独自ブロックである「STINGERマイボックス」 の使い方について説明します。
「マイボックス」では、以下のようなボックス装飾を行うことができます。
![AFFINGER6の「STINGER:マイボックス」サンプル](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-6.jpg)
ボックスの角を直角にしてシャープさを出したり、丸くして可愛さを出したりができます。
文字を内側に入れたり、アイコンや文字サイズの変更も可能(アイコンのデザインは「STINGER:メモ」と同様です)。
「マイボックス」の設定項目は以下の通りです。
![AFFINGER6の「STINGER:マイボックス」の設定項目](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-7.jpg)
見出し付きフリーボックス|AFFINGER6ブロックエディタ
![AFFINGER6独自ブロックで「STINGER:見出し付きフリーボックス」を選択](https://chironeko.com/wp-content/uploads/2021/08/AFFINGER6-icon3.jpg)
AFFINGER6の独自ブロックである「見出し付きフリーボックス」 の使い方について説明します。
「見出し付きフリーボックス」 のサンプルは以下の通りです。
![AFFINGER6の「STINGER:見出し付きフリーボックス」のサンプル](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-9.jpg)
「見出し付きフリーボックス」では、
- ボックスの色の変更
- アイコンや見出しの色や大きさを変更(アイコンは「STINGER:メモ」と同様)
- 角を直角にするか、丸くするかを選ぶ
などを行うことができます。
「見出し付きフリーボックス」の設定項目は、以下の通りです。
![AFFINGER6の「STINGER:見出し付きフリーボックス」設定項目](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-8.jpg)
バナー風ボックス|AFFINGER6ブロックエディタ
![AFFINGER6独自ブロックで「STINGER:バナー風ボックス」を選択](https://chironeko.com/wp-content/uploads/2021/08/AFFINGER6-icon4.jpg)
「バナー風ボックス」ブロックでは、以下のような装飾を行うことができます。
![AFFINGER6の「STINGER:バナー風ボックス」サンプル](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-10.jpg)
画像の上にテキストを置いたり、画像にリンクを貼ったりできます。
また、画像をぼかしたり暗くしたりする演出も可能です。
「バナー風ボックス」の設定項目は以下の通りです。
![AFFINGER6の「STINGER:バナー風ボックス」設定項目](https://chironeko.com/wp-content/uploads/2021/08/affinger6-editor3-11.jpg)