WordPress|メディア設定(画像サイズなど)【5/7基本設定】

2021-01-12

WordPress|メディア設定をする・画像サイズなど【5/7基本設定】

おのです。

WordPressで、メディア設定をしていきます。

WordPressのメディア設定では、主に画像のサイズに関する設定をしていきます。

 

画像を多く使うブログやサイトでは、画像のサイズはある程度需要なので、最初に理解しておくといいです。

しっかりメディア設定をしていきましょう。

 


スポンサーリンク


WordPress|メディア設定

WordPress|メディア設定をする・画像サイズなど【5/7基本設定】

では早速ですが、
WordPressのメディア設定について、解説していきます。

WordPressのメディア設定は以下の項目があります。

 

WordPress メディア設定

  1. サムネイルのサイズ
  2. 中サイズ
  3. 大サイズ
  4. ファイルアップロード

こういった内容を、メディア設定では設定していきます。

 

また今回は、初めにWordPressの画像サイズについて説明しておきます。

WordPressでは、1枚の画像をアップした際に、以下のサイズの画像が自動的に複製されます。

WordPressの画像サイズ

  • サムネイル:アイキャッチや小さいサイズで使用される
  • 中サイズ:記事内で使用
  • 大サイズ:記事内で使用
  • (フルサイズ):アップしたままのサイズ

フルサイズはアップしたままの画像ですが、他の3サイズが自動的に生成されます。

そして、記事投稿ではどのサイズの画像を使うか選択して使用します。

 

↓記事内の画像サイズのイメージとしては、こんな感じです。

記事内の画像サイズのイメージ

 

サイズ感はこんな感じです。
基本的には、いずれにせよ表示されるのはカラム幅が上限になります。

 

ということで、以下で順番に解説していきます。

 

1. サムネイルのサイズ

サムネイルのサイズ

 

サムネイルのサイズでは、
WordPressのテーマ内で使われるサムネイルサイズの大きさを設定します。

簡単に言うと、サイト内で使われる最も小さい画像サイズの大きさです。

 

↓例えば分かりやすく言うと、本サイトのインデックス一覧のアイキャッチ画像のサイズです。

本サイトのインデックス一覧のアイキャッチ画像のサイズ

 

私の使っているWordPressテーマで、AFFINGER5の場合はインデックス一覧の画像サイズを変更できます。

↓例えばこんな感じ。

  • 丸くする
  • 正方形にする
  • フルサイズにする
  • メディアサイズにする

このような場合で、「メディアサイズにする」を選択すると、ここで設定したサムネイルのサイズのアイキャッチ画像になります。

 

こういった感じで、WordPressのテーマによってサムネイルサイズの画像が使われますので、その場合のサイズを設定します。

ただし、サムネイルサイズの画像が使われる場所はテーマによって変わりますので、自分の使っているテーマではどこにサムネイルサイズが使わるか把握しておきましょう。

 

1-1. サムネイルを実寸法にトリミングする (通常は相対的な縮小によりサムネイルを作ります)

サムネイルを実寸法にトリミングする (通常は相対的な縮小によりサムネイルを作ります)

 

この機能については、以下になります。

 

チェックを入れる

チェックを入れる

サムネイルサイズより大きい画像がアップされた場合、指定した幅・高さを超えると、実寸大の画像の一部を指定したサイズの寸法で自動的に切り抜いたように表示してくれる。

チェックを入れない

チェックを入れない

サムネイル画像よりも大きい画像も、縦横比率を維持したまま、指定した幅・高さの範囲内で縮小表示される。つまり、元画像のアスペクト比を保ったまま小さくなります。

↓実際のアイキャッチはこんな感じ。

実際のアイキャッチはこんな感じ

 

いずれにせよ、指定した横幅が優先になります。

基本的によく分からない場合は、とりあえずサイズだけ指定して、チェックをしておけばオッケーです。

テーマのアイキャッチで推奨サイズがある場合には、それに合わせておきましょう。

 

 

2. 中サイズ

中サイズ

 

中サイズでは、記事内で使う画像の中サイズを指定できます。

基本的には、サイトのカラム幅を考慮して中程度のサイズにしておくのが一般的です。

例えば、メインコンテンツのカラムが750pxであれば300~400px程度が中サイズです。

好きなように設定してください。

 

2-1. 幅の上限・高さの上限

幅の上限と高さの上限は、デフォルトだと同じ数字になっています。

基本的には、横幅を基準にして決めますので、まずは「幅の上限」を決めます。

そして、高さの上限は同じ数字もしくは0にしておけば大丈夫です。

 

よく分からなければ、デフォルトで入力されているように、幅の上限と高さの上限を同じにしておけば大丈夫です。

 

この上限の意味としては、以下になります。

幅の上限・高さの上限

幅の上限・高さの上限

例えば幅の上限500px、高さの上限500pxに設定している場合に、横幅1000pxでアスペクト比2:3の画像をアップしたとします。

そういった場合は、まず横幅が500pxに設定されたのち、高さの上限の範囲内になります。

つまり横幅500pxでアスペクト比2:3の画像の縦幅は、333pxになりますので、元のアスペクト比を維持したままアップされます。

 

つまり、横型の画像であれば、横幅より縦幅が大きくなることはありませんので、同じ数字の設定でオッケーです。

 

 

3. 大サイズ

大サイズ

 

大サイズでは、記事内で使う画像の大サイズを指定できます。

基本的には、中より大きいサイズで、カラム幅より少し小さい横幅でいいと思います。

例えば、メインコンテンツのカラム幅が750pxであれば、700pxなどです。

 

そもそもですが、画像が表示されるのはカラム幅が上限になります。

なので、カラム幅いっぱいに表示させたいのであれば、画像投稿時にフルサイズを選びます。

 

 

4. ファイルアップロード

ファイルアップロード

 

ファイルアップロードでは、WordPressにアップした画像をサーバー内で一つのファイルに保存するか、年月で分けて保存するかを選択できます。

結論からすると、よく分からなければデフォルトのチェックをしたままでオッケーです。

 

4-1. アップロードしたファイルを年月ベースのフォルダーに整理

年月ベースのフォルダーに整理をする意味としては、サーバー内で画像フォルダーを年月ベースで作成してそこに画像が保存されます。

このチェックを外すと、年月ベースのフォルダーで管理をせずにひとまとめのフォルダーに入ります。

 

ちなみによく分からなければ、WordPressのデフォルトで推奨されているチェックをしたままでオッケーです。

 

年月ベースのフォルダーに保存しない場合、画像URLが若干短くなります。
年月ベースのフォルダーで保存する場合は、画像URLに年月が入りますので、URLが若干長くなります。

↓こんな感じ。

  • 年月なし|
    https://ono-code.com/wp-content/uploads/affinger5.png
  • 年月あり|
    https://ono-code.com/wp-content/uploads/2021/01/affinger5.png

URLが若干短くなるのでSEO的には有利といった声もありますが、結論からすると正直大差はありません。なので、どっでも大丈夫です。

むしろ、それよりもaltタグの入力の方がよっぽど重要です。

基本的には年月ベースにしておけば間違いありません。

 

設定が完了したら、最後に保存するのを忘れないようにしましょう。

設定が完了したら、最後に保存する

 

 

WordPress 基本設定ガイド

 

そんな感じで、WordPressのメディア設定でした。

これでバッチリです。

では。

 

おすすめ≫WordPress|おしゃれでSEOに強いおすすめの有料18テーマ【厳選】

おすすめ≫アフィリエイト|やり方・始め方:初心者はまずおすすめのASPに登録

このエントリーをはてなブックマークに追加

 

 無料オンライン体験レッスン可・プログラミング学習でスキルアップ!

WebデザインやHTML、CSS、サイトカスタマイズに関するプログラミング学習は、
プログラミングのオンラインスクールCodeCampがおすすめです。

特に、初心者でもHTMLとCSSの基礎を学んでおくと、ブログやサイトのデザインカスタマイズが圧倒的に上達してスムーズにできるようになります。

無料オンライン体験レッスンが可能なので、興味のある人は受講してみるといいです。当然、完全に初めての人でも問題ありません。

やはり自分のブログやサイトのデザインを自由にコントロールスキルが身につくと、サイト運営がとても楽になます。スキルアップもできるし、とても勉強になりますよ。

≫CodeCamp

-WP 基本設定
-,

© 2020 OnoCode.