AFFINGER6で会話吹き出しを設定する方法について、以下にわかりやすく手順を説明します。
AFFINGER6では、簡単に吹き出しを設定・カスタマイズできる機能が標準で備わっています。
以下のステップを参考にしてください。
目次
AFFINGER6の吹き出し設定の仕方
会話吹き出しの基本設定
AFFINGER6で吹き出しを使うには、まずアイコンや名前を設定する必要があります。
手順
- WordPress管理画面にアクセス
- WordPressの管理画面にログインします。
- 「AFFINGER管理」を開く
- 左側のメニューから「AFFINGER管理」をクリックします。
- 「会話アイコン」を選択
- 「AFFINGER管理」内にある「会話アイコン」をクリックします。
- アイコン画像と名前を設定
- 「アイコン名」: 吹き出しに表示する名前を入力します(例: “太郎” など)。空欄でもOK。
- 「画像」: 吹き出しに使用するアイコン画像をアップロードします。
- 推奨サイズは100px以上の正方形。
- 自分の写真やフリー素材、イラスト(ココナラなどで作成も可)を使用できます。
- 最大8個までアイコンを登録可能です。
- 設定を保存
- 画面下部の「Save」ボタンをクリックして設定を保存します。
記事内で吹き出しを使用する
設定した吹き出しを記事内で使用するには、エディターに応じた方法を選びます。
AFFINGER6はブロックエディター(Gutenberg)とクラシックエディターの両方に対応しています。
ブロックエディターでの使い方
- 記事編集画面で吹き出しを追加したい場所にカーソルを合わせます。
- 画面左上の「+」ボタンをクリックしてブロックを追加します。
- ブロック選択画面で「AFFINGER:会話ふきだし」を検索して選択します。
- 追加された吹き出しブロック内で以下を設定します:
- アイコン選択: プルダウンメニューから設定したアイコン(1~8)を選択。
- 向き: アイコンの向きを左または右に変更可能(ボタンで切り替え)。
- テキスト入力: 吹き出し内に表示したい文章を直接入力。
- 必要に応じて右側の設定パネルで調整します。
クラシックエディターでの使い方
- 記事編集画面で吹き出しを追加したい場所にカーソルを合わせます。
- 上部メニューから「タグ」→「会話吹き出し」を選択します。
- 表示したい吹き出しの番号(例: 「会話1」)を選びます。
- 吹き出し内に表示するテキストを入力します。
- 右側に配置したい場合は、ショートコードに「 r」(半角スペース+r)を追加します。
- 例: [speech_bubble type=”1″ r]テキスト[/speech_bubble]
吹き出しのカスタマイズ
吹き出しの見た目をさらに調整したい場合は、以下の方法でカスタマイズできます。
カスタマイズ手順
- カスタマイザーを開く
- WordPress管理画面の「外観」→「カスタマイズ」を選択します。
- 「オプション(その他)」を選択
- カスタマイザー内で「オプション(その他)」をクリックします。
- 「会話ふきだし」を選択
- 「会話ふきだし」メニューを開きます。
- カスタマイズ項目
- 背景色: 吹き出しの背景色を変更できます。
- 枠線の色・太さ: 吹き出しの枠線を追加したり、色や太さを調整可能。
- 形状: 吹き出しの形を変更できます(例: 角丸、四角など)。
- アイコンごとに異なる設定を適用することも可能です。
- 保存して公開
- 設定が完了したら「公開」ボタンを押して保存します。
その他のカスタマイズオプション
- アイコンを動かす: 「AFFINGER管理」→「会話アイコン」で「会話アイコンを少し動かす」にチェックを入れると、アイコンが軽く動きます。
- アイコンを大きくする: 同じく「会話アイコンを少し大きく」にチェックを入れると、アイコンが拡大表示されます。
AFFINGER6の吹き出しの注意点
- アイコンのサイズ: 80px未満の画像だと粗くなる可能性があるため、100px以上の正方形を推奨。
- 吹き出しの多用: 過度に使用すると記事が読みづらくなるため、重要なポイントや会話形式に限定して使うのが効果的。
- 内容の長さ: 吹き出し内のテキストが長すぎると見づらくなるので、短く簡潔にまとめることを心がけましょう。
吹き出しの活用
- 読者の目を引く: 吹き出しは目立つため、伝えたい重要な情報を強調するのに最適。
- 会話形式で親しみやすさUP: 質問と回答のような形式で使うと、読者に親しみやすい印象を与えられます。
- 左右の配置を使い分ける: 左側と右側を交互に使うことで、対話感を演出できます。
これでAFFINGER6の吹き出し設定が完了です!
簡単に設定できるので、記事にアクセントを加えたいときや読みやすさを向上させたいときにぜひ活用してください。
コメント