Otter Blocksプラグインは簡単にブロックにアニメーション(エフェクト)を付けられる以外にも便利が良いと感じた部分があったので備忘録。
リスト表示したい時リストマーカーを簡単に設定できる
デフォルトのリストブロックは至ってシンプル。それでほとんど事足りるのだが、Otter BlocksプラグインのIcon Listブロックは、Iconブロックと合体したようなブロックなので、リストマーカーを点や数字以外にしたい時に非常に便利。
通常のリストブロックのリストマーカーは、

点か数字のみ。


Icon Listブロックは、リストマーカーを数多くのアイコンから選択出来たり、オリジナル画像にも設定出来たりする。

ブロックを選択すと、3項目サンプルとして挿入される。

リストマーカーを、

簡単に好きなアイコンに設定できる。

ただし、項目毎アイコンを指定出来るのだが、リスト項目全部のリストマーカーをまとめて設定することが出来なかった。私だけか??

1項目ずつアイコンを選択するのはちょっと面倒かな・・・
項目を増やしたい時は、右下+をクリックする。

増える。

色やサイズ、間隔を簡単に設定できる
細かい設定が簡単に出来る。

- アイコン、テキストの色をそれぞれ設定出来る
- テキストサイズを設定
- アイコンサイズを設定
- 項目間のスペースを設定
- アイコンとテキストのスペースを設定
横並びリストも可能
あまり使うことはなさそうだが、水平並びのリストも可能。
通常は垂直(Vertical)リストだが、


水平(Horizontal)並びにしたい時はこうなる。


オリジナル画像のリストマーカー
CSSでオリジナルリストマーカーを設定する必要がなく楽である。
例えば、このブログのサイトアイコンをリストマーカーに設定してみる。

こんな感じになる。

結論
リストを賑やかにしたい時、とても便利なブロックである。

OtterBlocks
Otter Blocksプラグインの活用方法。主なブロックの説明をしてます。
Amazon.co.jp