みなさんこんにちは、ぬーぼーです。
ネットサーフィンをやっていてたまに見かける吹き出し。
↓こんなやつ
この記事では、こういった吹き出しの設定方法について説明します。
この記事の目次
吹き出しの設定方法
この項ではAFFINGER5の吹き出しの設定方法の場所への行き方と、アイコンの設定方法について説明します。
- メインナビゲーションメニューの「AFFINGER5 管理」を選択
- 「会話・ファビコン等」を選択
- 「会話風アイコン」の項目でアイコン名とアイコン画像を設定
メインナビゲーションメニューの「AFFINGER5 管理」を選択
WordPress管理画面の左側にあるメインナビゲーションメニューの「AFFINGER5 管理」をクリックします。
「会話・ファビコン等」を選択
「会話・ファビコン等」を選択して、会話風アイコンを編集することができます。
「会話風アイコン」の項目でアイコンを設定
アイコン名とアイコン画像を決める必要があります。
アイコン名は今回は「いぬくん」としておきました。
次にアイコン画像のアップロードです。「アップロード」ボタンがあるので、ここからアイコンとなる画像をアップロードします。
アイコン画像の画素は60 × 60 px以上が推奨されています。
実際に吹き出しを設定してみる
それでは実際に吹き出しを設定してみましょう。
例えば、吹き出しにhello worldを入力したい場合は次のようになります。
吹き出しの位置を右側にする
「スペース ＋ r」を追加することで吹き出しの位置を右側にすることができます。
例としては次の通り。
吹き出しの色をカスタマイズする
吹き出しの色は次の順でカスタマイズ画面まで行けます。
- メインナビゲーションメニューの「外観」の「カスタマイズ」をクリック
- 「[+] オプションカラー」をクリック
- 「会話風ふきだし」をクリック
- 吹き出しの設定編集画面に到着
会話吹き出しの編集画面では次の項目ついて設定ができます。
- 会話の背景
- アイコンの枠線を消す
- ふきだしを角丸にしない
- ボーダーデザインタイプ(2px)に変更
会話の背景
吹き出しの背景の色を変更することができます。
ここでは水色を例にしています。
アイコンの枠線を消す
「アイコンの枠線を消す」にチェックを入れると、アイコンの枠線の色が消えます。
有名サイトをいくつか見てみると枠線がない場合が多いので、枠線はないほうがいいのかもしれません。
ふきだしを角丸にしない
「ふきだしを角丸にしない」にチェックを入れると、吹き出し文章の背景が角張ります。
基本的に吹き出しは角丸のほうがやんわりとした雰囲気があって個人ブログでつかうにはおすすめです。角張った吹き出しはニュース記事などカチッとした文章に向いていますね。
ボーダーデザインタイプ(2px)に変更
「ボーダーデザインタイプ(2px)に変更」にチェックを入れると、吹き出しに枠線の追加と、背景の色を選択することができます。
まとめ
いかがだったでしょうか。
AFFINGER5をとりあえず、購入して吹き出しの設定を初めてやる人向けになるべくわかりやすく記事を書いてみました。
それではまた！