はじめに(前回記事からの続き)
前回の記事では、Cocoonの装飾ブロックとして、
- 囲み枠(ボックス)
- 吹き出し
- 表(テーブル)
を実際に触りながら体験しました。
文章だけでも記事は書けますが、画像が入ることで「ブログらしさ」は一気に高まります。
今回は、XServer10日間無料体験の最後のステップ として、
- 本文の中に入れる画像
- 記事の顔となるアイキャッチ画像
この2つを、実際に触りながら体験していきます。
ここまでできれば、「ブログ記事を一通り作れる状態」 になっています。
今回のゴール(無料体験の最終ゴール)
この記事のゴールは、次の3つです。
- 画像を記事に入れる操作を体験する
- アイキャッチ画像の役割を知る
- 「ブログを公開できる形」が完成したと実感する
完璧に作る必要はありません。
「一連の流れを体験できた」ことが、今回の最大の成果 です。
ブログ記事で使う2種類の画像
WordPressのブログでは、主に次の2種類の画像を使います。
- 本文の途中に入れる画像
- アイキャッチ画像(記事の代表画像)
それぞれ役割が違うため、順番に解説していきます。
本文に入れる画像を使ってみよう
本文画像は、
- 説明を補足する
- 文章ばかりで疲れるのを防ぐ
- 記事の流れに区切りをつける
といった目的で使われます。
今回は、体験なので複数枚の画像を 入れていきます。
画像を入れる
+ をクリック

① メディアブロックの「画像」を選択
② 画像ボックスが表示される
③ サイドバー(投稿やブロックなど)が表示されていなければクリック
④ サイドバーのブロックを選択

① アップロード をクリック
② ファイル選択ダイアログが開くので、画像を選択
③ 「開く」をクリック

画像の解像度変更
① 本文に画像が表示される
② 解像度はサムネイルを選択(画面のサイズが小さくなる)

同じ操作を繰り返して、解像度「サムネイル」「中」「大」の3枚の画像を作成

画像のスタイル変更
① 画像を選択
② スタイルをクリック
③ 角丸を選択(画像が角丸になる)

同じ操作を繰り返して、スタイル「デフォルト」「角丸」「Mono」の3枚の画像を作成

アイキャッチ画像を設定してみよう
アイキャッチ画像とは?
アイキャッチ画像は、
- 記事一覧
- トップページ
- SNSでシェアされたとき
に表示される、記事の代表画像 です。
いわば、この記事の「表紙」 のような役割を持っています。
アイキャッチ画像は必須?
結論から言うと、
- 設定しなくても記事は公開できる
- ただし、設定したほうが分かりやすい
という位置づけです。
今回は、「一度設定してみる」ことを目的 に進めます。
どんな画像を選べばいい?
最初は、次の考え方で十分です。
- 記事内容と大きくズレていない
- 文字が入っていなくてもOK
- 自分が「これでいいかな」と思える
- 推奨サイズは、横1280px × 縦720px
正解はありません。
ホームページ(アイキャッチ画像が未設定)

記事にアイキャッチ画像を設定
「アイキャッチ画像を設定」をクリック

① 「ファイルをアップロード」を選択
②「ファイルを選択」をクリック

① ファイル選択ダイアログが開くので、画像を選択
② 「開く」をクリック

アイキャッチ画像を設定 をクリック

保存 をクリック

同じ操作を繰り返して、他の2つの記事もアイキャッチ画像を設定

ホームページ完成版(アイキャッチ画像を設定)

はじめてのブログ記事|Cocoonの文章表現力(装飾)

はじめてのブログ記事|Cocoonの独自ブロック

はじめてのブログ記事|画像

画像を設定してみて感じたこと
本文画像とアイキャッチ画像を設定すると、
- 記事一覧が一気にブログらしくなる
- 記事ごとの区別がつきやすくなる
- 「ちゃんとブログを作った感覚」が出てくる
と感じられるはずです。
無料体験としては、ここまでで十分
ここまでの6回で、
- サーバー契約(無料体験)
- WordPressの初期設定
- 記事を書く
- 装飾を使う
- 画像とアイキャッチを設定する
という、ブログ開設から記事作成までの一連の流れ を体験しました。
無料体験としては、これ以上やらなくても問題ありません。
まとめ|ブログ開設の体験はここで一区切り
今回は、
- 本文画像の挿入
- アイキャッチ画像の設定
を体験し、「ブログ記事が完成するところまで」 を確認しました。
これで、
「自分にもブログは作れそう」
と感じられたなら、XServer10日間無料体験の目的は十分に達成できています。
次回予告|ここからは「続けたい人向け」の内容になります
次回からは、ブログ運営を本格的に続けたい方向け に、
- XServerの本契約の仕方
- 独自ドメインの取得方法
を、ひとつずつ解説していく予定です。
独自ドメインを取得すると、本格的なブログ運営のスタート になります。
「もう少し続けてみようかな」
そう思えた方だけ、次へ進んでみてください。