WordPressで画像を追加・変更する方法
記事に写真を入れたい、トップページの写真を新しいものに変えたい。
WordPressでは、画像の追加や差し替えも管理画面からおこなえます。
この記事では、画像を追加する方法と、差し替える方法、アップロードの前に準備しておきたいことを解説します。
1.画像を扱う2つの場所
WordPressの画像は、主に次の2つの場所で扱います。
| 場所 | できること |
|---|---|
| メディアライブラリ（「メディア」→「ライブラリ」） | アップロードした画像の一覧を見る、まとめてアップロードする、説明を入れる |
| 画像ブロック（記事や固定ページの編集画面） | 記事の中に画像を入れる、差し替える |
記事に画像を入れるだけなら、編集画面の画像ブロックから、アップロードと配置をまとめておこなえます。
2.アップロードの前に準備する理由
スマートフォンやカメラで撮った写真は、そのままだとファイルがとても大きいことがあります。大きな画像をたくさん使うと、ページの表示が遅くなる原因になります。
また、画像のファイル名や代替テキスト（画像の内容を説明する文章）は、画像が表示されないときや、画面を読み上げる機能を使う人、検索エンジンに、画像の内容を伝える役割があります。
アップロードの前に、画像の大きさを整えて、内容が分かる名前を付けるだけで、ページが軽く、伝わりやすくなります。
3.追加と差し替えの手順
アップロードの前の準備
- 横幅を、表示する大きさに合わせて小さくする（多くの場合、横1200〜1600ピクセルほどで足りる）
- ファイル名を、半角の英数字で内容が分かるものにする（例：shop-front.jpg）
- 人の顔が写っている場合は、載せてよいか確認する
記事に画像を入れる
- 01画像ブロックを足す
編集画面で「＋」を押し、「画像」を選びます。
- 02画像を選ぶ
「アップロード」でパソコンから選ぶか、「メディアライブラリ」から選びます。
- 03代替テキストを入れる
右側の設定の「代替テキスト」に、画像の内容を短く書きます。
- 04大きさと配置を整える
必要に応じて、大きさや配置を調整し、記事を保存します。
画像を差し替える
記事の中の画像を選ぶと、上に出るツールバーに「置換」があります。押して新しい画像を選ぶと、配置はそのままで画像だけが入れ替わります。
※テーマによっては、トップページなどの画像を「外観」→「カスタマイズ」や「エディター」から変える場合があります。
代替テキストの書き方
| 悪い例 | よい例 |
|---|---|
| 写真 | 浅草の店舗の外観。のれんと提灯が下がっている |
| IMG_1234 | 新商品の抹茶どら焼き |
飾りのための画像など、内容を伝える必要がない画像は、代替テキストを空にします。詳しくは、画像のalt属性とは？で解説しています。
4.よくある質問
アップロードした画像を削除すると、どうなりますか？
その画像を使っている記事やページから、画像が表示されなくなります。削除する前に、どこで使われているか確認しましょう。
画像がアップロードできません。
ファイルが大きすぎる、または対応していない形式であることが考えられます。画像を小さくするか、JPEG・PNG・WebPなどの形式で保存し直してみましょう。
同じ画像を、何度もアップロードしてしまいました。
使っていない方を、メディアライブラリから削除して整理しましょう。使われている場所を確かめてから削除します。
スマートフォンの写真を、そのまま使ってもよいですか？
使えますが、ファイルが大きいことが多いため、横幅を小さくしてからアップロードするのがおすすめです。
5.まとめ
WordPressの画像は、編集画面の画像ブロックから追加でき、「置換」で差し替えられます。
- アップロードの前に、横幅を小さくし、内容が分かるファイル名にする
- 代替テキストに、画像の内容を短く書く
- 差し替えは、画像を選んで「置換」から
- 削除する前に、使われている場所を確かめる
まずは、次に入れる写真の大きさとファイル名を整えてから、アップロードしてみましょう。画像を軽くする方法は、WordPressの画像サイズを最適化する方法で解説しています。
画像の差し替えや、トップページの写真の変更で困っている場合は、浅草Web屋にご相談ください。