自宅サロンママのためのネット集客術

WordPressで作るホームページ制作サービス

WordPressで記事内に写真を入れる方法(裏技付き)

December 15, 2016
149 views
約 4 分
WordPressで記事内に写真を入れる方法(裏技付き)

前回の記事の続きです。

「WordPressで記事を書く方法」

記事の書き方の基本がわかったら、
WordPressで記事内に写真を挿入する方法をご紹介しますね。

写真の追加方法には様々ありますが(プラグインも含め)、まずは基本の方法とSEOにも関わる注意事項をご説明します。

写真を追加する時の注意

WordPressで写真を使うなら、
これだけは守ってください。

写真のファイル名を半角英数字にする

PCに保存されている段階で、

『プロフィール写真』とか
『講座の様子』とか、

あえてわかりやすく日本語で名前を付け替えている場合があります。

このままアップすると、
スマホで表示されない場合があります。
(私は9割方NGでした)

面倒ですが、

プロフィール写真.jpg

profile.jpg

講座の様子.jpg

seminar.jpg

などなど、

何でもいいので半角英数字に変更してから、以下の手順で進めてください!

 

写真の追加方法

※これは基本操作です。最後の「おまけ」でちょっとだけ楽な方法をご紹介します。

①メディアを追加をクリック

写真の追加

 

②すでに使える状態になっている写真が一覧で表示される「メディアライブラリ」が表示されます。新しく写真を追加したい場合は、「ファイルをアップロード」をクリックします。

写真の追加

 

③「ファイルを選択」して写真を指定するか、ここに直接写真をドラッグしてもOK。

写真の追加

 

④追加されるとメディアライブラリに戻ります。

メディアライブラリ

あとは、【固定ページに挿入】でOKですが、ここでいくつか注意点があります!!

 

写真のタイトルとキャプション

写真を選択すると右下に、
タイトルやキャプションを入れられる設定があります。

タイトルやキャプション

 

面倒ですがSEOを意識するなら、この中の【タイトル】と【代替テキスト】は入れてください。

 

<div class=”box”>

【タイトル】→写真につけられているファイル名がそのまま表示されます。HP上で画像のマウスポインターを合わせた時表示されます。できれば写真に合った名前をつけておいてください。(冒頭で説明したように、アップロードする前からファイル名は半角英数字にしておくこと )

【キャプション】→画像のすぐ下に簡単な補足説明を追加できる

【代替テキスト】→SEOに重要となります。何の画像かを表す言葉を入力

【説明】→訪問者からは見えない管理用のメモ書き</div>

 

入力するのは【タイトル】と【代替テキスト】のみでOK!

 

写真のサイズ

テーマによって、挿入後の写真のサイズ調整ができない場合があります。

その場合は、挿入前に写真サイズを決めます。

写真サイズ

 

一度変更すると、その後挿入する写真もそのサイズで入っていきます。

プレビューで確認しながら、
調整してくださいね。

 

アイキャッチ画像について

WordPressには、通常の記事内に挿入する写真とは別に、【アイキャッチ画像】というのがあります。

こんな風に、記事の一覧に表示されるもの。
アイキャッチ画像に何も表示しないと、見栄えが悪いので、面倒でもこちらは必須です!

アイキャッチ画像

 

アイキャッチ画像の選び方

写真を見て、その記事を読んでみようかどうか、決められてしまうこともあります。

記事内に入れた写真の中で、
(又は別に用意してもOK)

一番その記事内容にしっくりくるものを選んでください。

同じカテゴリーの記事で同じ写真ばかり使うと、
カテゴリーの一覧表示した時に同じ写真が続いてよくわからなくなります。。

例)手を抜いたせいでこんなことに・・・
同じ写真の重なり

 

 

【おまけ】写真を楽に入れる方法

最後に、写真をちょっと早く入れる方法。

ちょっと早くといっても、
本当にちょっとですけど。。

入れたい写真が入っているフォルダを、
編集画面の上に重ねて・・・

メディアの追加

追加したいあたりに、
ポイッとドラッグします。

このあと手順④の画面になって、
タイトルや代替えテキストは自分で入れます。

PCのウィンドウ操作に慣れている方は、是非やってみてくださいね!

 

以上です!