先日、ブロックのデザインを手軽に変更できる、ブロックDressの話とアルバムブロック用のデザインサンプルについてご紹介しましたが、
今回は、タブブロック・アコーディオンブロックについて詳しくお伝えしたいと思います。
ブロックDressの概要と使い方をおさらい
前回もお伝えしましたが、使い方はとても簡単です。
デザインを変更したいブロックのブロックデザイン（ブロックDress）を変更するだけです。
必ず対応のブロックレイアウトに変更しましょう。
※画面は開発中です
色変更も簡単
提供されるブロックDressにはあらかじめDressカラーが設定されているので、あらかじめそのサイトにDressカラーが設定されていれば、ピッタリな配色で挿入できます。また、色味を変えたいときの調整も簡単です。メインカラー、サブカラー4、５が初期設定されていますのでそこで変更しましょう。
あらかじめDressカラーが設定されていれば、サイトで使用している色に置きかわります。
デザイン一覧
アンダーライン（タブ）
見出し部分に動きのある下線を置いたシンプルなデザイン。
こんなサイトにおすすめ！
たくさんのコンテンツをシンプルにまとめたい時に。
BiNDupのテンプレートなら、AZUMA、ABSTRACT RECORDSとの相性が良さそうです。
ブリック（タブ/アコーディオン）
マウスオーバーで見出し部分の背景が伸びる。背景にはストライプが入ったPOPなデザイン。
こんなサイトにおすすめ！
ポップな雰囲気のサイトに。
BiNDupのテンプレートなら、MARUTA Apple farmに合いそうですね。
吹き出し（タブ/アコーディオン）
見出し部分が吹き出し、コンテンツ部分には括弧が付いたイラスト風なデザイン。
こんなサイトにおすすめ！
吹き出しの形を生かして、よくある質問・Q&Aとの相性がバツグン！
BiNDupのテンプレートなら、MURATA Manipulative Institute、office MIYAZAKIなど何でも合いそうです。
ライン（アコーディオン）
一見シンプルですが、見出しのマウスオーバー時に背景色が現れるデザイン。
こんなサイトにおすすめ！
シンプルに見せたいけど、少し動きも欲しい時に。
BiNDupのテンプレートなら、OMG inc.、BC-TECなどのビジネステンプレートで使ってみてはいかがでしょうか。
利用上の注意点
基本的には変更したいブロックにブロックDressテーマを適用するだけですが、場合によってはサイト全体に設定したDressが影響しデザインが多少異なる見た目になる場合があります。その場合は適宜調整をお願いします。
サイト全体のDressが影響し、背景色が付いてしまっている（左上）
いくつかご紹介してきましたが、利用できそうなシーンはありそうでしょうか？
アルバムブロックを含めて全11種類が、もう間もなく実装予定です。
タブやアコーディオンのデザインが新しくなるのは久しぶりのこと！実装されましたら、ぜひ使ってみてください。
POINT
- 変更したいブロックにブロックDressテーマを適用するだけ
- サイトDressの設定によっては調整が必要な場合も
- タブやアコーディオンのデザインはコンテンツやサイトの雰囲気で選ぼう