【初心者向け】Cocoon（コクーン）の使い方【画像挿入編】

この記事ではCocoonの画像挿入に関して初心者の方向けに解説しています。

※　アップデートにより操作画面が変更になっている可能性があります。

Cocoon（コクーン）で記事に画像を挿入する方法

記事に画像を挿入するのはとても簡単です。

ブロックから「画像」を選択して挿入したい画像をアップロードすればOKです。

Cocoon（コクーン）で変更できる画像のスタイル

Cocoon（コクーン）では挿入した画像に対して、１４種類のスタイルを設定することができます。

デフォルト	角丸
Clarendon	Gingham
Moon	Lark
Reyes	Juno
Slumber	Crema
Ludwig	Aden
Perpetua	Mono

実際にどんな風に表示されるのか、Cocoon（コクーン）で作成したサンプルページを作成したのでそちらを参考にしてみてください。

スタイル以外にもこの記事に関係する実際のCocoon（コクーン）での画像表示を確認できます。

→　Cocoon（コクーン）で記事に画像を挿入した際の表示例一覧

Cocoon（コクーン）　画像の設定項目について

画像を挿入した際の設定項目について確認していきます。

①：ALTテキスト（代替テキスト）	画像の説明を入力する欄です
②：画像サイズ	フルサイズ・中・サムネイルの３種類が選択可能
③：枠線・角丸	枠線の太さや角丸が設定可能

①：ALTテキスト（代替テキスト）

ALTテキスト（代替テキスト）の欄にはその画像の説明を入力します。

【入力時の注意点】

• 記事の内容に関係のないデザイン的な画像のAltテキストは「空欄」にする
• 記事の内容にそったAltテキストを簡潔に入力する

②：画像サイズ

画像サイズはフルサイズ・中・サムネイルの３種類から選択することができます。

③：枠線・角丸

画像に枠線と角丸を設定することができます。

【枠線】

【角丸】

画像に関するWordPress既存の機能

①：配置	画像の配置を変更可能
②：リンクを挿入	リンクの挿入
③：切り抜き	画像の切り抜き
④：画像上にテキストを追加	画像上にテキストを表示させることが可能
⑤：デュオトーンフィルターを適用	デュオトーンフィルターを適用する

①：配置

画像の配置を変更できます。

②：リンクを挿入

画像にリンクを設定することができます。

③：切り抜き

画像を切り抜いて表示させることができます。

④：画像上にテキストを追加

画像上にテキストを追加することができます。

⑤：デュオトーンフィルターを適用

デュオトーンとは２色組を組み合わせて表現したデザインのことで、画像を目立たせたり雰囲気を変えたりすることができます。

実際にどんな表示になるかは、Cocoon（コクーン）で作成したサンプルページを確認してみてください。

→　Cocoon（コクーン）で記事に画像を挿入した際の表示例一覧

記事に画像を利用することは読み手の方に見やすく解りやすい記事を作成するのに重要です。

見やすい記事・解りやすい記事を作成することはブログの収益化にも直結してきます。

画像を利用して、見やすく解りやすい記事を作成してみてください。