今回は、コクーン(Cocoon)で記事中に「アイコン付きの吹き出し」を挿入する方法を紹介します。
吹き出しとは、このような会話風に表示されるアイコン付きのパーツです。
また、複数の吹き出しを並べて使用することで「会話風」に解説することもでき、読みやすい記事にもなります。
コクーンを使ってブログを運営されている方は、ぜひ参考にしてください。
コクーンで吹き出しの設定を行う方法
まず、ワードプレスの管理画面を開き、「Cocoon設定」→「吹き出し」と画面を移動します。
吹き出しの一覧画面が開くので、画面上部にある「新規追加」のメニューをクリックしてください。
このような、吹き出しの新規作成画面が開くので、上から順番に各項目を設定していきましょう。
項目名 | 内容 |
---|---|
タイトル | 吹き出しのタイトル |
名前 | アイコンの名前 6文字以下を推奨 |
アイコン画像 | アイコンとして使用する画像 |
吹き出しスタイル | 吹き出しの表示デザイン 「デフォルト」「フラット」「LINE風」「考え事」から選択 |
人物位置 | アイコンの表示位置 「左」「右」から選択 |
アイコンスタイル | アンコンの表示デザイン。「四角(枠線なし)」「四角(枠線あり)」「丸(枠線なし)」「丸(枠線あり)」 |
TinyMCE | 記事の投稿画面で、吹き出しの選択一覧の中に含めるかどうか。 特に理由がなければチェックを入れたままでOK。 |
このように上から順番に設定して、最後に「保存」をクリックして、設定を保存します。
これで、吹き出しの新規作成が完了し、記事投稿画面から挿入可能になります。
吹き出し一覧の画面に戻ると新規作成した吹き出しが追加されていればOKです。
ちなみに、既存の吹き出しに関しては、不要であれば「削除」を行ってしまっても問題ないです。
もしくは、「編集」のメニューをクリックし、内容を編集して使用してもOKです。
↓
編集画面を開くと、このように各項目を変更できる仕様になっています。
それでは、次の段落ではアイコン付きの吹き出しを記事に挿入する方法を紹介します。
コクーンで吹き出しを記事に挿入する方法
コクーンで、記事内にアイコン付きの吹き出しを挿入する方法を説明します。
今回は、ブロックエディタとクラシックエディタで分けて説明していきます。
ブロックエディタを使用している場合
まずは、ブロックエディタを利用している場合に、アイコン付きの吹き出しを挿入する方法を紹介します。
「+」をクリックしてブロックメニューを開いてください。
「吹き出し」と検索して、そのまま吹き出しを挿入します。
このように、アイコン付きの吹き出しが挿入されました。
画面右側に吹き出しに関する設定項目があります。
「人物」という項目があるので、そこで、上記で作成した吹き出しを選択してみてください。
このように、吹き出しが変更されます。
次は、吹き出しの右側のブロックに、アイコンのコメントを入力しましょう。
これで、アイコン付きの吹き出しの設定が完了です。
記事を公開すると、このように表示されているはずです。
クラシックエディタを使用している場合
次は、クラシックエディタを利用している方向けに、アイコン付きの吹き出しを挿入する方法を紹介します。
エディタ上に「吹き出し」というセレクトボックスがあるので、クリックしてください。
選択項目が出てくるので、使用したい吹き出しを選択して挿入します。
このようにエディタ内に吹き出しが挿入されます。
ここでコメントを入力すると、アイコン付きの吹き出しが完成します。
実際に記事を公開すると、このようにユーザーへの公開サイトに表示されます。
これで、アイコン付きの吹き出しの設定が完了です。
最後に
今回は、ワードプレスの人気テーマ「コクーン(Cocoon)」で、記事内にアイコン付きの吹き出しを挿入する方法を紹介しました。
また、会話風に吹き出しを繰り返すことで、記事が非常に見やすくなります。
コクーンを使用している方は、ぜひアイコン付き吹き出しも積極的に使用していきましょう。
コメント