DIVER（ダイバー）には「吹き出し」系の入力補助が3種類用意されています。
コード不要で挿入画面で簡単に挿入できます。
吹き出しは色んなシーンで使われますが、記事中にあると堅苦しくなく、文字だけは伝わりにくい感情が伝わりやすいです。
目次
DIVER（ダイバー）で使える3つの「吹き出し」系入力補助
- 吹き出し
- 口コミ
- 会話
DIVER（ダイバー）の入力補助では、「吹き出し」「口コミ」「会話」の3パターンの吹き出しが用意されています。
使うシーンに合った吹き出しを使う事ができ、この3つの吹き出しを使えば吹き出しの装飾で困ることはないと思います。
吹き出しといえば、こういった会話付アイコンが良く見られますよねー。
入力補助「吹き出し」
入力補助の「吹き出し」を選択
吹き出し挿入画面を表示
DIVER（ダイバー）の入力補助「吹き出し」は、吹き出しの挿入画面で必要な情報を入力するだけなので簡単です。
吹き出しの挿入画面ではカラーの選択が吹き出ししか選択できませんが、テキストの色は通常のテキスト色変更で変更できます。
吹き出しの方向と角の丸みの指定
DIVER（ダイバー）の入力補助「吹き出し」は上下左右に吹き出しだけ挿入することができます。
角丸では吹き出しの角の丸みをpx単位で調節できますが、指定したpxやテキストの長さによっては吹き出しのデザインが崩れがちなので確認しながら挿入してみてください。
挿入してみた感じ、吹き出しの角は10pxまで見た目があまり変わりませんでした。
上下左右＋ 角丸
吹き出し上タイプ＋角丸（0px)
吹き出し下タイプ＋角丸（10px）
吹き出し左タイプ（20px）
吹き出し下タイプ＋角丸（30px）
ピンクのフレームの20pxはもう少し縦長になるようにテキストを表示しないと吹き出しのデザインが崩れちゃいました。
カラータイプの選択
カラータイプでは、フレームか、吹き出し内の背景を7色から選択することができます。
カラータイプ「ボーダー」
吹き出しのカラータイプ「ボーダー」では、吹き出しのフレームの色を変えることができます。
ボーダー（青）
ボーダー（緑）
ボーダー（ピンク）
ボーダー（黄色）
ボーダー（オレンジ）
ボーダー（グレー）
ボーダー（黒）
カラータイプ「背景」
吹き出しのカラータイプ「背景」では、吹き出し内全てを塗りつぶした吹き出しが挿入できます。
吹き出し背景（青）
吹き出し背景（緑）
吹き出し背景（ピンク）
吹き出し背景（黄色）
吹き出し背景（オレンジ）
吹き出し背景（グレー）
吹き出し背景（黒）
吹き出しをカラムでアレンジ
吹き出しはカラム表示で画像を組みあせて表示するのも面白いかも！
カラム表示で画像に吹き出しを付けてみました。
こういった使い方もできるので吹き出しの使い方次第では使用用途が増えそうです。
入力補助「口コミ」
口コミを選択
口コミ挿入画面を表示
DIVER（ダイバー）の入力補助「口コミ」では、レビュー記事に役立つ吹き出しを挿入することができます。
口コミらしく、口コミ投稿者の画像とレビュー評価の星付き口コミが作れます。
口コミの作り方はDIVER（ダイバー）の口コミ挿入画面に必要な項目を入力するだけなので簡単です。
「口コミ」挿入の2つの口コミデザイン
DIVER（ダイバー）の入力補助「口コミ」では2タイプの口コミを作ることができます。
口コミタイプ1
口コミの評価の星について
口コミ評価の星は5段階です。
「口コミ」のタイプ1のデザインはコレ
DIVER（ダイバー）の口コミ挿入のタイプ1のパターンはこのような口コミを作ることができます。
2カラムで表示してみました
2カラムで口コミタイプ1を表示してみました。
口コミを並べると見やすいです
たくさんある時はカラムで表示すると便利です。
パターン1の口コミは画面いっぱいにレビューが表示されるので、レビューをたくさん表示する時は、カラム表示するとスッキリ見えます。
挿入するアイコン画像は丸く切り取られます。
画像は中心から切り取られるので、思った位置で切り取られない場合は、余白を作って調整してみてください。
口コミパターン2
タイプ2は横幅いっぱいに表示されます。
口コミを縦に並べて表示する時に使うのがおすすめです。
口コミのパターン2の口コミデザインは画像の横に吹き出しが付くタイプです。
パターン2では口コミのアイコン画像は四角に切り取られます。
アイコン画像はパターン1と同じく調整が必要な場合があります。
アイコン画像は中心から切り取られるので、思った位置で切り取られない場合は、余白を作って調整してみてください。
入力補助「会話」
吹き出しといえばこの会話アイコン付きスタイルがよく見られます。
こういった吹き出しは複数人が登場して会話しながら記事が作れるので一方的に内容を伝えるのではなく、ストーリー性を持たせて記事を読んでもらうことができます。
アイコン画像は丸く切り取られます。
アイコン画像は中心から切り取られるので、思った位置で切り取られない場合は、余白を作って調整してみてください。
会話といえば、これでしょ！！
DIVER（ダイバー）の3つの「吹き出し」系の入力補助まとめ
- 入力補助は「吹き出し」「会話」「口コミ」の3種類ある
- コード不要で簡単挿入
- 設定によっては吹き出しのデザインが崩れる場合もあるので注意
- アイコン画像は自分で調整が必要
DIVER（ダイバー）の吹き出しは記事内の自分のアイコンの「会話」だけでなく、レビューで必要な「口コミ」や「吹き出し」が用意されています。
これだけあれば吹き出しの装飾で悩む必要はなさそうです。
吹き出しを使うときに注意しておきたいのが、DIVER（ダイバー）はアイコン付き吹き出しを作る場合、アイコン画像が中心から切り取られる仕様になっています。
アップロードした画像が思った箇所で切り取られない場合は画像に余白を作ったり、切り取って挿入する必要があるので少し手間がかかります。
吹き出しを挿入する箇所や設定によってデザインが崩れたりもしますが、コードやプラグインを挿入することなく吹き出しが作れるので初心者でも簡単に色んなパターンの吹き出しを作ることができ便利です。
使ってなかったけど入力補助の「口コミ」が思ったよりきれいに表示さてれて良い感じでした。
ハイスペックテーマ「Diver（ダイバー）」は安く買える！？
サーバー契約をするとワードプレスの有料テーマ「Diver」がお得に買えます。
ロリポップ×Diver
特別価格１７,９８０円 → １２,９８０円
お名前.com×Diver
特別価格１７,９８０円 → １5,１８０円
さらに独自ドメインと同時申込みで、ドメインの初年度登録料が実質0円でお得。
エックスサーバー×お友達紹介
エックスサーバーなら友達紹介でお得
友達紹介プログラムでエックスサーバーを契約すると12か月契約で5,000OFF。
契約期間に応じて最大1万円OFF
下記のボタンからエックスサーバーを契約するとお友達紹介プログラムが適用され、契約料金が割引きされます。
エックスサーバーのキャンペーン（不定期）と併用するとさらにお得です。
テーマを安く購入するよりもサーバー契約でお得にDIVERを始められます。
