画像アップロード時の画像自動生成で自分のブログの横幅に合った画像のみを生成する方法

WordPressで画像をアップして、「メディアを追加」するとき、サイズが色々あってなんだこれって思いませんでしたか?

WordPressが画像をアップロードすると、初期設定のままだとサイズの違う5種類の画像が作成されることがあります。

でも、そんな色々なサイズの画像を使うことはまずありません。

ディスク容量の無駄ですね。

ということで、いらないサイズの画像が作られないように設定します。

また、記事内での画像は、大きな画像を指定しても、縮小されて表示されます。
そこで、ブログの表示にちょうど合う画像が作られるようにしてみます。

ブログ記事の画像のサイズの調べ方

ブログの記事の横幅は、テーマやカスタマイズで変わってきます。

自分のブログに画像を表示した際にどのサイズで表示されるか判れば、そのサイズの画像を作ってやると、無駄に大きな画像がダウンロードされることはなくなり、表示速度の低下も起こりません。

Chromeでの調べ方

ここでは、Chromeでの表示サイズの調べ方を紹介します。

画像が入った記事の表示

まず、記事の横幅一杯に表示されている記事を用意します。

なければ、編集中の記事に画像を入れてプレビューで表示しても構いません。
編集画面内は、実際の大きさと違うのでダメです。

横幅が小さいと画像も小さくなるので、画面は最大化しておいたほうがよいです。

下の家の画像は、横幅1200ピクセルの画像を貼っています。

 

Chromeの機能でサイズを調べる

次にF12 キーを押し、デベロッパーツールを起動します。

画像サイズを調べるとき、画像の左下にサイズが表示されるので、画像の一番下の部分が表示されるようにスクロールします。

  1. 一番右のアイコンを押す
  2. サイズを調べたい画像にカーソルを合わせる
  3. 画像サイズが表示されるので、サイズを確認する

確認が終了したら、もう一度F12 キーを押して、デベロッパーツールを消します。

私のブログの場合は、740ピクセルでした。

作成される画像の設定・

メディア設定画面での設定

メディア設定画面の表示

WordPressの管理画面を開き、【設定】の【メディア】をクリックします。

 

作成される画像サイズの変更

サムネイルのサイズ・中サイズ・大サイズを設定して、【変更を保存】をクリックします。

ここでの設定は、幅と高さ

指定したサイズ以下にリサイズされるため、0を指定すると画像が作成されなくなります。

私は、サムネイル・中サイズは使わないので、すべて0に設定しました。

そして、大サイズの幅の上限には、先ほど調べた740を設定しています。
高さの上限は、ちょっと大きい気もしますが1024にしました。

 

medium_large_size_wの生成の停止

自動作成される画像はまだあります。
WordPress4.4からはmedium_large_size_wの自動生成が行われおり、768ピクセルの画像がつくられます。
これは、メディア設定から画像を作成しないよう設定することはできません。

option.phpを使って、設定します。

http(s)://ドメイン名/wp-admin/options.php

ドメイン名」の部分は、自分のサイトに置き換えてアクセスを行います。

設定ページが表示されるので、medium_large_size_wの項目を0に設定し、

 

設定ページにアクセスしたら「medium_large_size_w」という項目を見つけて、次の画像のように0という値を設定しましょう。

値を変更したら一番下までスクロールして【変更を保存】ボタンを押せばこのサイズのサムネ画像も生成されないようになります。

上記で設定されるはずなのですが、私の環境では「閲覧できません (Forbidden access)」という表示がでて設定できませんでした。
この現象については、調査中です。
最新情報をチェックしよう!