WordPressでアイキャッチ画像を設定する方法

WordPressではブログを読んでくれる人の目をひきつけるアイキャッチ(サムネイル)と呼ばれる画像を投稿記事ごとに入れることができます。

今回はその設定方法を説明していきます。アイキャッチ画像を効果的に使って多くの人にブログを読んでもらいましょう。

1. アイキャッチ画像の有効化

functions.phpに下記のコードを追加して、アイキャッチ画像を有効化しましょう。

<?php add_theme_support('post-thumbnails'); ?>

すると、ダッシュボードの記事投稿の画面右下に「アイキャッチ画像を設定」と追加されます。

2. アイキャッチ画像の設置

アイキャッチ画像を実際にページに設置する場合は、下記のコードをPHPファイルに追加してください。

<?php the_post_thumbnail('画像サイズのID'); ?>

画像サイズのIDには以下のものが設定可能です。

  • thumbnail(サムネイル)
  • medium(中サイズ)
  • large(大サイズ)
  • full(フルサイズ)

各サイズの設定は、管理画面の左下にある「設定」>「メディア」で変更可能です。IDの指定をしなかったときは、初期設定のサムネイル画像サイズとなります。

初期設定の画像サイズを変更したいときは、以下のコードをfunctions.phpに追加しましょう。

<?php set_post_thumbnail_size(横のサイズ, 縦のサイズ, 切り抜きの有無); ?>

切り抜きとは、縦横比で不要な部分を縮小後に切り取ることです。

「切り抜きの有無」は、trueかfalseで指定します。切り抜きを行う場合はtrue、縦横比を維持したまま縮小を行いたい場合はfalseとなります。

例えば、横300px、縦200pxで切り抜きを行いたい場合は、以下のようなコードになります。

<?php set_post_thumbnail_size(300, 200, true); ?>

3. アイキャッチ画像をリサイズする

アイキャッチ画像は、一旦アップロードをしてしまうと画像サイズの設定を変更したとしてもリサイズはしてくれません。そのため、画像をリサイズしてから再度アップロードする必要があります。

しかし、プラグインを使って自動的にアップロード済みの画像をリサイズすることも可能です。

まず「Regenerate Thumbnails」というプラグインをインストールして有効化します。

「ツール」>「Regen. Thumbnails」を選択、「Regenerate All Thumbnails」ボタンをクリックすると、あとは自動的にリサイズをしてくれます。

個別でも画像のリサイズができますので、使い分けると便利です。

また、このプラグインを使ってリサイズを行う場合、もともと設定されていたサイズの画像は無くなってしまう為、バックアップを取ってから行うようにしましょう。


イベント