[WordPress] サムネイル(アイキャッチ)画像の設定いろいろ
サムネイルを表示させる方法は比較的簡単に見つかったのですが、
alt や title が画像名になってしまい、不恰好だったので、調べてみました。
まず、サムネイルの表示方法から説明します。
1.サムネイルを表示させる
サムネイルとは、上記画像のように、
画像挿入の時に「アイキャッチ画像として使用」をクリックした時に表示される画像です。
上記サイトに詳しく書いてあるのですが、初心者の私が試したところ、
function.php で設定したとおりにならなかったので、別の方法でサイズ指定しています。
とりあえず、function.php に、
add_theme_support( 'post-thumbnails' );
と記載するところまでは、同じです。
(記載箇所はfunction.phpの一番最後でいいと思います。)
次に、set_post_thumbnail_size( 50, 50, true ); を記載してみたところ、上手くリサイズされなかったので、私は下記のようにテンプレート(index.php など)に直接サイズを書きこむ方法にしました。(下記の場合、150×150px)
<?php the_post_thumbnail( array(150,150); ?>
※デフォルトは<?php the_post_thumbnail(); ?>
2.alt、titleを変更する
上記の記述で表示した場合、画像のaltもtitleも画像名がはいります。
(sample.jpgを指定した場合、sampleと表示されます)
「投稿名を入れたい!」と思った人は私だけではないはずです。
日本語サイト見つからなかったから、海外サイトまで探しに行ったよ!
そして、初めて自分でコードいじったよ!成長した(TワT)/
<?php $title= get_the_title(); the_post_thumbnail(array( 150,150 ), array( 'alt' =>$title, 'title' => $title)); ?>
$title= get_the_title() が投稿名を取得。
array( ‘alt’ =>$title, ‘title’ => $title) で$titleを出力してます。
![]()
The Ultimative Guide For the_post_thumbnail In WordPress 2.9
(ここのサイトのコメントから探して応用しました)
3.サムネイルがなかった場合、デフォルト画像を表示させる
画像って毎回準備するのは面倒なもの。
サムネイル画像が無い時に、勝手に表示してくれる機能は下記の記述で実現できます!
<?php if ( has_post_thumbnail() ): // サムネイルを持っているときの処理 ?> <?php $title= get_the_title(); the_post_thumbnail(array( 150,150 ), array( 'alt' =>$title, 'title' => $title)); ?> <?php else: // サムネイルを持っていないときの処理 ?> <img src="common/img/no_thumb.jpg" alt="no image" title="no image" width="150" height="150" /> <?php endif; ?>







