デザイン制作、Web制作、ブログ運営などのノウハウを配信するサイト

WordPress アイキャッチ画像の追加方法

WordPressでのアイキャッチ画像の追加方法を紹介します。
アイキャッチ画像とは、ブログのトップページの記事ごとに表示されている
サムネイル画像のことです。(以下画像の赤枠部分)
アイキャッチ画像追加1

スポンサーリンク

アイキャッチ画像設定を有効にする

WordPress管理画面の[外観]⇒[テーマの編集]を選択し、
functions.phpを編集します。
add_theme_support( ‘post-thumbnails’ )を追加して、ファイルを更新します。

これで、記事の編集画面でアイキャッチの画像設定が表示されるようになります。
※アイキャッチ画像の設定が表示されないときは、表示オプションでアイキャッチ画像にチェックが入っているか確認してください。
アイキャッチ画像追加2

アイキャッチ画像を設定する

投稿の編集画面で[アイキャッチ画像を設定]をクリックし、
設定したい画像を選択し、[アイキャッチ画像を設定]をクリックします。
これでアイキャッチ画像が設定されました。
アイキャッチ画像追加3

アイキャッチ画像を出力する

さて、実際にページに出力するには、出力させるためのコードを書く必要があります。
出力させたいページのphpファイルにphp the_post_thumbnail();を追加します。
また、アイキャッチ画像が設定されている場合のみ出力させるため、
if( has_post_thumbnail() ):の条件文を追加しています。
アイキャッチ画像追加4

補足情報
the_post_thumbnail()のパラメータは以下が設定できます。
・thumbnail・・・サムネイルサイズ
・medium・・・中サイズ
・large・・・大サイズ
・full・・・フルサイズ

最後に

これでアイキャッチ画像がページに出力されます。
アイキャッチ画像は、訪問者の注意を引いて記事へ誘導する効果があるようですので、
まだ設定されていない方はぜひ設定してみてください。
以上、参考になれば幸いです。

スポンサーリンク

いいね!を押すと、
最新記事をお届けします。

Twitter で

ブログ用WordPress無料テーマ
「chameleon(カメレオン)」

WordPressテーマ(chameleon)は、「WordPressで手軽・気軽にブログ始められる」をコンセプトに制作しました。
初めてWordPressでブログを始める方、是非シンプルなテーマchameleon「カメレオン」を使ってみてください!

ブログ用無料WordPressテーマ

士業用WordPress無料テーマ
「InomaExpertBasic」

士業用の無料WordPressテーマを作成しました。
もちろん、一般的なビジネスサイトに活用できます。
自分でサイト更新したい方、
これからホームページを立ち上げようとする方、
自分でWordPressテーマを作ってみたい方、
この無料テーマを是非活用してみてください。

無料WordPressテーマ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


ページトップボタン