「WordPressで画像の設定方法を知りたい」
「プラグインで簡単に画像を設定したい」
こう思っている方も多いのではないでしょうか。
WEBサイトにおける画像は、文字ばかりで読み手が疲れてしまうのを防いだり、図表で内容の理解をサポートするといった重要な役割があります。
そこでこのページでは、WordPressで画像を設定する方法についてわかりやすく解説しています。
さらに、おすすめの画像プラグインや画像設定の注意点についてもまとめているので、ぜひ参考にしてください！
このページを読んで、あなたのサイトがよりよいものになれば幸いです。
WordPressで画像を設定する方法
まずは、WordPressで画像を設定する方法を見ていきましょう。
WordPress初心者の方でも簡単に設定できますよ！
挿入方法
WordPressで画像を挿入する方法は2つあります。
メディアから挿入する
WordPressの記事中に、メディアから画像を挿入する方法を紹介します。
具体的な手順は以下の通りです。
1.画像挿入したい位置にポインタを合わせる
2.「メディアを追加」をクリックする（タイトルとパーマリンクの下）
3.メディア追加の画面から挿入したい画像を選択する
4.「メディアライブラリ」タブを選択する
5.該当の画像を選択し「投稿に挿入」をクリックする
上記の手順で、記事中の好きな場所に画像を挿入することができます。
挿入に成功した場合は、テキストエディタに以下のような表記がされているはずです。
< img class="任意のクラス名"
src="http://画像のURL先.jpg"
alt="" width="横幅" height="縦幅" / >
画像をアップロードしてから挿入する
自分のパソコンに保存されてる画像をアップロードしてから、写真を挿入する方法を紹介します。
具体的な手順は以下の通りです。
1.画像挿入したい位置にポインタを合わせる
2.「メディアを追加」をクリックする（タイトルとパーマリンクの下）
3.「ファイルを選択」をクリックする
4.ファイルの選択画面から該当の画像を選択し「開く」をクリックする
5.選択した画像のアップロードが開始される
6.アップロードが完了したら右下にある「投稿に挿入」をクリックする
上記の手順で、記事中の任意の場所にお気に入りの画像を挿入することができます。
3のアップロードを選択する画面では、挿入したい画像を直接ドラッグ&ドロップしても構いません。
位置
画像の投稿画面では、画像を「左寄せ」「中央寄せ」「右寄せ」という風に、自由に指定できます。
「添付ファイルの表示設定」から、好きな位置に画像を設定してください。
クリックするとセレクトボックスが表示され、「左寄せ」「中央寄せ」「右寄せ」が選べるようになります。
任意の位置を選択後、通常の作業を行えば掲載完了です。
位置を指定しない場合は、自動的に「左寄せ」になります。
挿入後であっても、エディタのメニューバーから設定することもできます。
画像を選択後、メニューバーのアイコンから位置調整してください。
サイズ
アップロードされた画像は、複数のサイズが自動生成されるため、自由に大きさを変更することができます。
どのようなサイズが作成されたかは、WordPressの管理画面左メニューにある「設定」⇒「メディア」から確認してください。
メディア設定の画像サイズ画面をみると、通常のサイズ以外に「サムネイルのサイズ」「中サイズ」「大サイズ」が確認できると思います。
これは、画像をアップロードする方法6の「添付ファイルの表示設定」欄にある、「サイズ」に記載されているものと同じものです。
画像挿入の際は、「サムネイルのサイズ」「中サイズ」「大サイズ」を自由に指定できます。
任意のサイズを選択して画像挿入すれば、メディア設定画面に記載されている上限値が、そのまま画像サイズとなって反映されるはずです。
上限値を満たさない画像は、メディアの選択画面に表示されません。
例えば大サイズが1024・中サイズが300の場合、アップロード画像が500であれば大サイズは生成されません。
この場合、中サイズから画像選択できるようになります。
一般的な自動生成機能では、縦横比は維持したままなので、見栄え的も全く問題ありません。
ただしサムネイルだけは「サムネイルを実寸法にトリミングする（通常は相対的な縮小によりサムネイルを作ります）にチェックがあるため、正方形の形にトリミングされます。
縦横比を維持したまま、サムネイルとして使いたい場合は、上記のチェックを外しましょう。
詳細設定
画像は、詳細設定を加えることもできます。
「添付ファイルの表示設定」の上にある項目から、「URL」「タイトル「キャプション」「代替テキスト」「画像の説明」を設定可能です。
URL
挿入した画像の場所を表示している箇所です。
変更することはできないため、特に意識する必要はありません。
タイトル
「どのような画像なのか」を明らかにしたい場合に入力します。
検索順位に影響することがないため、無理に設定する必要ありません。
キャプション
画像の下に表示されるテキストのことです。
ユーザーに画像の内容を伝えたい時や、出典元を明確にしたいときなどに利用します。
代替テキスト
何らかの原因により画像が表示されなくなった場合に、代替コンテンツとして使われるテキストです。
元々どのような画像が表示されていたのかを、ユーザーに伝える役目があります。
自由に設定できますが、キーワードを乱立させすぎるとスパム扱いになるので注意が必要です。
画像の説明
どのような画像なのか、どのような時に使用するのかなどを記録するメモのようなものです。
サイト中に表示されることもないため、自分用に適時利用していきます。
削除方法
挿入した画像を削除したい時は、該当箇所を選択して「×ボタン」をクリックします。
BackSpaceキーなどでも代用可能です。
WordPressで画像のURLを確認する方法
画像をツールなどで利用する場合は、URLを取得して場所を指定してあげる必要があります。
アップロードした画像のURL取得方法は以下の通りです。
1.アップロード後、画面下に表示される画像の「編集」ボタンをクリック
2.詳細画面内の「ファイルのURL」に記載されているURLをコピー
上記手順でURLを取得した後は、コピー&ペーストで各ツールに利用していきます。
例えば、画像の横に吹き出しテキストを表示したい場合は、以下のショートコードに画像URLをペーストします。
[voice icon="画像URL" name="名前" type="l"]吹き出しテキストを記入[/voice]
サイドバーに画像を表示させたい場合は、「外観」⇒「ウィジェット」から、テキストウィジェットを配置します。
その中に以下のコードを記載し、画像URLをペーストすれば完了です。
< img src="画像URL">
WordPressでおすすめの画像プラグイン
WordPressには、便利な画像プラグインが用意されています。
ここでは、それぞれの概要と特徴を見ていきましょう。
EWWW Image Optimizer
画像の重さを解消するプラグインです。
サイトの稼働に影響を与えるくらい大きな画像を軽量化できます。
WP Retina 2x
通常の画像を、Retinaディスプレイで使えるような高画質画像に変換してくれるプラグインです。
画像の質にこだわりたい方におすすめです。
Imsanity
縦横比を維持したまま、画像を一括でリサイズしてくれるプラグインです。
PNGやJPGなどに変換する機能もあります。
Easy FancyBox
クリックすることで画像を拡大表示できるプラグインです。
小さな画像であっても、視認性を高めることができます。
クリックの際、左右に表示される矢印を選択すると、前後の画像を表示させることも可能です。
動画ファイルやPDFファイルなども同様に利用できます。
Pixabay Images
無料でダウンロードできる画像素材を提供しているプラグインです。
画像をお探しの方は、是非お試しください。
Modula
シンプルで綺麗な写真ギャラリーを作成できるプラグインです。
20枚までなら無料でギャラリーを作成できます。
Envira Gallery
Modulaと同様の機能を有するプラグインです。
有料版からは、写真の販売や自動透かし機能を利用できます。
Page Builder
WordPressの記事投稿を便利にしてくれるプラグインです。
画像やテキストなどの各要素をブロック単位で配置できるため、記事ごとに様々なレイアウトを楽しむことができます。
WordPressで画像を設定するときの注意点やポイント
ここでは、WordPressで画像を挿入する時の注意点やポイントを紹介します。
画像がぼやける原因
挿入した画像がぼやけるのは、WordPress側が自動で拡大・縮小するためです。
例えば、小さい画像を無理に大きくすると、粗が目立ち画質が落ちます。
元の画質を保持したまま記事に表示したい場合は、画像挿入画面で「フルサイズ」を選択するとよいでしょう。
ポップアップ表示などを利用する
「添付ファイルの表示設定」のリンク先にメディアファイルを指定すると、クリックするだけで画像を拡大できるポップアップ表示ができます。
画像をアップロードできなくてもあわてない
WordPressで画像がアップロードできない時は、HTTPエラーと呼ばれるメッセージが表示されます。
このようなエラーが発生した場合は、以下のような方法で対処してください。
・画像系プラグインを停止させる
・php.iniを編集する
・WordPress、テーマ、プラグインを最新のバージョンに更新する
php.iniは各サーバーの管理画面から変更できます。
編集画面を開いたら、「max-execution-time」という項目を、60に設定しましょう。
使用しているサーバーやサイトの稼働状況によって、色々な数値を試してみてください。
max-execution-timeの数値をいくら変更しても改善しない場合は、「max_input_time」「memory_limit」「post_max_size」「upload_max_filesize」なども変更してみましょう。
画像挿入できない場合
記事投稿画面にある「メディアに追加」が反応しない場合は、画像プラグインが原因の場合があります。
WordPress・テーマ・プラグイン・PHPのバージョンが古くなってないかを確認しましょう。
カスタム投稿タイプを利用している場合は、導入方法に問題がなかったか再度確認してください。
WordPressで使えるフリー画像プラットフォーム一覧
プラグインの悪影響を抑えたい場合は、フリー画像プラットフォームを利用するのがおすすめです。
ここではWordPressの画像挿入に使える、有名なフリー画像サイトを紹介します。
Pixabay
無料の画像・写真・イラストをダウンロードできるサイトです。
改変から商用利用も可能で、著作権などの表示義務もありません。
160万点以上のコンテンツが用意されているため、画像不足に陥ることはないでしょう。
日本語でも画像を検索しやすくなっているので、ブログ初心者にもおすすめです。
Pixabaのページはこちら
写真AC
ユーザーが投稿した画像を無料でダウンロードできるサイトです。
日本人による投稿が多く、国内向けの画像を探している時に役立ちます。
無料会員では、待ち時間やダウンロード回数に制限があるのが難点です。
写真ACのページはこちら
Unsplash
高品質な写真をダウンロードできるサイトです。
プロが撮ったような写真を記事中に掲載できます。
Unsplashのページはこちら
BURST
ネットショッピング作成サービスを営む「Shopify」が提供しているフリー画像サイトです。
BURSTのページはこちら
4GRATISOGRAPHY
ゆるふわな雰囲気の写真が多いサイトです。
コンテンツは多くありませんが、高品質な写真が豊富です。
GRATISOGRAPHYのページはこちら
タダピク
フリー画像サイトの情報を集めているサイトです。
キーワード検索すれば、複数のサイトの画像を検索することができます。
サイトごとに画像を探したくない場合に役立ちます。
タダピクのページはこちら
まとめ
WordPressで画像掲載するには、記事投稿画面の「メディアを追加」をクリックします。
アップロードされた画像は複数のサイズが自動生成されるため、投稿時に自由に選択可能です。
詳細設定は、代替テキストを入力するくらいでちょうどよいでしょう。
画像プラグインは、写真の見栄えやサイトの重さを改善してくれます。
ただし多すぎると、何らかの不具合が出る可能性があるので注意してください。
利用目的を明確にして、必要最低限に抑えるのがおすすめです。
フリー画像プラットフォームなども利用して、自分に合った画像の使い方を見つけましょう。
