WordPress

【AFFINGER5】会話吹き出しの使い方を分かりやすく解説!現役AFFINGERブロガーが直伝!【アフィンガー5】

会話吹き出しの使い方を解説


今回はWordPressテーマ「WING(AFFINGER5)」の、「会話吹き出し」の使用方法について解説します!

誰にでもすぐに使うことができるように分かりやすく説明致しますので、ぜひ最後までお付き合い下さい🙇‍♂️

WING AFFINGER5

AFFINGER5 の「会話吹き出し」とは?

以下のような自分の指定した画像から台詞(セリフ)を言わせたいと思った時に使用する表現方法になります。

コレが会話吹き出しだ!

【はじめに】WordPress環境確認

はじめに、WordPressの環境確認を行います。下記のテーマとエディタ環境に合わせてから記事を読み進めることを推奨します。

使用するWordPressの環境

  • テーマ:WING AFFINGER5
  • エディタ:クラシックエディタ


会話吹き出し用のアイコン登録

まずは、吹き出しに使用するアイコンの登録をします!( 楽しんでいきましょう😁 )

※ 時間がない人はピンクのボックスを実行していけば、すぐに会話吹き出しが使用できるようになっていますのでご活用下さい。

WordPress管理 > 「AFFINGER5管理」

AFFINGER5管理の選択

サイドバーの一覧 > 「会話・ファビコン等」をクリック!

会話・ファビコン等を選択

クリックした後に表示されるページの中で、以下のように「会話風アイコン」というセクションが発見できると思います。

会話風アイコンのセクション

ズバリ!ココで、会話吹き出し用のアイコンを登録できるのですが、、、

ぜひ、覚えていただきたいのは【アイコン画像1】から【アイコン画像8】まで合計8アイコンまで登録することが可能ということです。

今回は【アイコン画像1】の枠を使用してアイコンの登録をしていきます!(1~8どれを使っても問題ないです)

アイコン登録数の確認

「アップロード」をクリック!

アップロードボタンをクリック

画像を選択する時には、「新規画像をアップロードして使用する」、「アップロード済の画像を使用する」の2つの選択肢を選べます。

新規画像を使用する場合

「ファイルをアップロード」をクリック!

ファイルアップロードをクリック

「ファイルを選択」をクリック!

ファイルを選択をクリック

100px以上の正方形画像をオススメします。

アップロード済の画像を使用する場合

「メディアライブラリ」をクリック!

メディアライブラリをクリック

以前にアップロードした画像が一覧で表示されますので、使いたい画像を決めてクリックします!

画像ライブラリ

100px以上の正方形画像をオススメします。

【時短テク】

ご紹介した2種類の方法で問題なくアップロードもできるのですが、どちらの画面に置いてもドラッグ&ドロップによるアップロードが可能です。

好き嫌いは分かれるかもしれないですが、個人的にはドラッグ&ドロップの方が時短アップロードができるので好きです。ぜひ使ってみてください!

アップロードが完了したら画像のURLが自動で入力されます。

画像のURLが自動入力される様子

アイコン名入力の位置

アイコン名(有り)の場合

アイコン名有りのアイコン

アイコン名(なし)場合

アイコン名なしのアイコン

保存する

アイコン保存ボタン

以上で登録が完了になります。

WING AFFINGER5

会話吹き出し用アイコンの設置

アイコンが保存できたら設置に進みます。(すぐ完了しますよ!)

投稿に移動する

タグ > 会話吹き出し > 会話1~8(ご自身が選択された番号)

会話吹き出しの選択

後は、セリフを入力してくださいね。
※ 最初は何も入力されていません。

セリフを入力する!

会話吹き出しセリフ

以上で設置が完了です。

WING AFFINGER5

まとめ

こんなに便利な吹き出し機能が簡単に使えるなんて、AFFINGER5は最高ですね!

この他にも、アイコンを一定時間置きに動かしたり、アイコンを少し大きくすることもできます。

また、吹き出しアイコンの向きも変えることができるので非常に扱いやすい機能です。

ぜひ、ご自身のブログ活動に活用してみて下さい!

以上です!

WING AFFINGER5

テックキャンプで人生が変わった話
【体験談】テックキャンプに行ったらマジで人生が変わった話

  最近話題の「テックキャンプ」興味はあるけど、実際の所どうなんだろう?   そんなお悩みをお持ちの方に、実際にテックキャンプを卒業した私からリアルな体験談をお話しさせていただきた ...

続きを見る

エンジニアの転職をお考えの方へ

スポンサーリンク

-WordPress

© 2023 プロワク