![<strong>ブログを</strong><br><strong>始めた人</strong>](https://gyroibaraki.com/wp-content/uploads/2021/02/kaisya_komaru_woman-150x150.png)
始めた人
吹き出しを使ってみたいけどどうやって使うんだろう?
パソコン初心者なので、誰かわかるように親切な解説をしてほしい。
自分で選んだ画像を使いたいなぁ。
こういった疑問に答えます。
- cocoonで記事に吹き出しを使う3ステップ
- 吹き出しの画像を好きな画像に変更する
このブログもcocoonをテーマにしています。
上に出てきた吹き出しはブログのテーマにcocoonを使っている人なら簡単にブログに取り入れることが可能です。
実際にcocoonでブログを運営している僕が「cocoonで吹き出しを使う方法」を画像を使いながら丁寧に解説していきます。
cocoonで記事に吹き出しを使う3ステップ
cocoonで吹き出しを入れる方法はとてもシンプルです。
- 手順①:エディタで「+」ボタンをクリック
- 手順②:ブロックの検索に「cocoon」と入力する
- 手順③:「吹き出し」を選択する
順番に見ていきましょう。
手順①:エディタで「+」ボタンをクリック
グーテンベルグエディタのブロックにカーソルを合わせると右側に「+」ボタンが表示されます。
ここをクリックしてください。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/bbb1b7ab3425d6117ed931cebcc64319-1024x191.png)
手順②:ブロックの検索に「cocoon」と入力する
ブロックの検索窓に「cocoon」と入力してください。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/59abccaee879be373a83a199c816d55b.png)
手順③:「吹き出し」を選択する
cocoonのブロック一覧が表示されますのでその中から「吹き出し」を選んでください。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/53cd9e42fc6c180afc43c4ec9c3da729.png)
そうすると、このように吹き出しが記事に挿入されます。
![](https://gyroibaraki.com/wp-content/themes/cocoon-master/images/man.png)
ヤッホー吹き出し爆誕!!
吹き出しの設定を変更する
挿入した吹き出しはブロックの設定でスタイルや色などを変更することが可能です。
設定を変更して自分好みにカスタマイズしてみてください。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/7ec51134e84fd94acf2d5e11f17a92b4-477x1024.png)
吹き出しの画像を好きな画像に変更する
ここでは吹き出しで自分が用意した画像を使用する方法について解説します。
画像の変更は2パターンあります。
- エディタ上で画像を変更する
- あらかじめ画像を入れたものを用意しておく
エディタ上で画像を変更する方法
こちらは簡単で、エディタ上に表示されたアイコンをクリックするだけです。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/e1a2c5523b82136f7d31c4fa7e046d74-1024x250.png)
すると、メディアを選択する画面が出てきます。
そこから自分の好きな画像を選択してください。
あらかじめ画像を入れた吹き出しを用意しておく方法
あらかじめ吹き出しで使用する画像を決めておくこともできます。
何度も同じような吹き出しを使う場合はこちらであらかじめ用意しておくと使いまわせるので便利です。
ダッシュボードの「cocoon設定」の「吹き出し」を選択します。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/520e5dc38a230d4ebd1a1c12551d2364.png)
吹き出しの設定画面が出てくるので「新規追加」ボタンをクリックします。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/36b17e2be9301a2bf54d0c95efc809dc-1024x534.png)
新規吹き出しの設定画面が表示されます。
![](https://gyroibaraki.com/wp-content/uploads/2021/02/71a173965c912ea207f836da8dcef994.png)
設定する項目は次の3つでOKです。
- タイトル
タイトルを見ただけでどんなアイコンか識別できるようにしておいた方が良いです! - 名前
アイコンの下に表示されます。キャラクターを決めているならその名前を入れておきましょう。 - アイコン画像
ここに自分の好きな画像を入れましょう。正方形の画像を設定することが推奨されています。
これらの設定ができたら「保存」ボタンを押して保存しましょう。
![YUSUKE](https://gyroibaraki.com/wp-content/uploads/2020/06/名称未設定のアートワーク.jpg)
新しく自分専用のアイコンができました!!
吹き出しの使い方まとめ
記事のポイントをまとめます。
- 吹き出しを入れる手順は3ステップです。
- 手順①:エディタで「+」ボタン/ 手順②:cocoonで検索/ 手順③:吹き出しを選択
- 吹き出し画像の変更は2パターン
- エディタ上でアイコンをクリックする
- 吹き出しの画像を変えるにはcocoon設定の吹き出しから行う
実際に自身のブログで吹き出しを使って読者とってわかりやすい記事を書いてみてください。
コメント