アイキャッチ設定画面

ワードプレスのアイキャッチを設定する画面を投稿画面に表示する方法について

ワードプレスのアイキャッチ画像設定画面の表示方法についてまとめてみました
投稿日: 2012/03/28
最終更新日: 2015/12/29
 

最近、アイキャッチがどうのとか、アイキャッチは絶対必須!みたいなことをよく耳にします。
アイキャッチってのは、文字通り目を引く何かで、ブログでは見出し画像がそれを担っています。

そのアイキャッチをどう設定して良いのか悩んだ過去があります。
そして、新たにWPを設定した今!また悩んだ!

アイキャッチ設定画面を投稿画面に表示する

特に難しい事はありません。
function.phpにあるコードを追加するだけ。

ワードプレスのテーマフォルダの中に「funcitons.php」というファイルがあります。

アイキャッチの設定

このファイルのどこでもいいので、下記のコードを追加して下さい。

add_theme_support( ‘post-thumbnails’ );

すると投稿画面右下当たりに設定用のフォームが現れます。

アイキャッチ画像設定画面

ここでアイキャッチの画像を設定することで投稿ページで表示することが出来ます。

アイキャッチ画像を表示させる

設定したからには表示させたいですよね?

サムネイルを表示するテンプレートタグが下記です。表示させたい箇所に埋め込んで下さい。

<?php the_post_thumbnail(); ?>

えっ?サイズも調整したい?わがままだな~

アイキャッチ画像のサイズを調整する

設定は簡単です。任意のサイズにする場合は下記の方法を使います。
設定サイズはpxです。(下記は、100px * 100px)

<?php the_post_thumbnail(array(100,100)); ?>

その他の設定は下記です。

the_post_thumbnail(); 「そのまんま表示します」
the_post_thumbnail(‘thumbnail’);「サムネイル表示」
the_post_thumbnail(‘medium’);「中サイズです」
the_post_thumbnail(‘large’); 「大サイズです」

簡単ですよね。もちろん、ループ内で使ってくださいね、
そうじゃないと、どの投稿のアイキャッチ画像を表示していいかWPが判断付きません。

表示オプションで解決

投稿画面上部にある「表示オプション」で簡単にアイキャッチ設定フォームを表示できちゃう!

表示オプション

以前のバージョンの時はコードを追加していたけれど、今の(バージョン3.3.1)だと追加コードも必要無いようです。普通に動いているので結果オーライですね(`・ω・´)ゞ

ごめんなさい!嘘ついてました。3.3.1で確認したらやはりコードは必要でした。

 
最新情報をお届けします
筆者のご紹介
角政典@moreiic
真性のお家大好きフリーランスです。プログラムよりご飯の方が断然好き!博多出身のデブデザイナー。インドアだけど遊んでくれる人募集中!
Twitter / google+
よく検索されてる記事