こんにちは、テンテンです。
今回は、THE THORで吹き出し画像の使い方やデザイン変更についてのまとめを解説させていただきます。
【吹き出し事例】
通常、吹き出しなどはプラグインなどを導入して活用する場合が多いですが、THE THORの場合、デフォルトで吹き出しが入っているので、プラグインなどを導入することなく使用することができます。
今回は、大きく3つのテーマで解説させていただきます。
①THE THORでの吹き出しの使い方について
②吹き出し画像の変更方法について
③吹き出しデザインの変更方法について
あらかじめ、吹き出しに使う画像を用意しておいてくださいね！
では、早速解説に進みます。
THE THOR（ザ・トール）の吹き出しの使い方について
吹き出しの使い方自体は、とても簡単です。まずは、記事の投稿画面を開きましょう。
「プリセットパーツ」→「吹き出し」から吹き出しのスタイルを選ぶことができます。
デフォルトの背景スタイルは、背景がグレーになっている吹き出しで、デフォルトのボーダースタイルは、背景が白の吹き出しとなっています。
下記に、各デフォルトの吹き出しの画像を載せておきます。
【吹き出しデフォルトの状態】
このままでも使えなくはないですが、やはりオリジナルの画像に変更したいですよね！
吹き出しの画像変更やデザイン変更もできるので、ここから解説していきますね。
使い方自体の解説は以上となります。
THE THOR(ザ・トール)の吹き出しの画像を変更する方法について
ここからは、吹き出しの画像変更方法について解説をしていきます。
カスタマイズから吹き出し画像を設定しておくことで、吹き出しのデザイン固定して使うことができます。
①「外観」→「カスタマイズ」に進みます。
②「パーツスタイル設定[THE]」に進みます。
③「吹き出し設定[個別ページ用]」に進みます。
④「画像サイズを選択」、「吹き出し画像の設定」、「名前を入力」をします。
赤枠で囲っている箇所は、必ずするべき設定で、青枠で囲っている箇所は必要に応じて設定をしてください。
ちなみにnameの部分は、手打ちで変更していきましょう。
名前も入力ができるようになったので、入力しておくことをオススメします。
【吹き出しの画像サイズの参考例】
ノーマル
ビッグ
THE THOR（ザ・トール）で吹き出しのデザインを変更する方法
THE THORでは、吹き出しのデザインを変更することができます。
吹き出しデザイン変更の参考例
上記の吹き出しは、当ブログで使っている一つの吹き出しデザインです。
LINEをイメージして作成しています。
THE THORは、吹き出しの背景色や文字色、枠線の色など変更することができます。
①先ほどと同様に、カスタマイズの「吹き出し設定[個別ページ用]」に進みましょう。
※「外観」→「カスタマイズ」→「パーツスタイル設定[THE]」→「吹き出し画像の設定」
【THE THORの吹き出しのタイプ2種類】
・背景吹き出しのスタイル
・ボーダー吹き出しのスタイル
後は、オリジナルの吹き出しデザインを作るだけです。自由に好きなデザインを作ってみてください！
さいごに
吹き出しデザインは、割と多く使うCSSの一つなので、しっかり覚えるようにしておきましょう！
THE THOR（ザ・トール）は細かい設定もたくさんあって、なかなか覚えられにくい点もありますが、使いこなしていくことで、よりデザイン性が優れたブログができますよ。
最後まで読んでいただき、ありがとうございました。