
WordPressのthe_post_thumbnail(‘large’)でアイキャッチ画像を表示させると、imgタグごとの生成されてしまうのでURLのみ取得してsrc属性に入れて自由にカスタムする場合の書き方
WordPress関連記事

【WordPress】ローカル開発からサーバーへ移行に便利な「Search Replace DB」の使い方

.htaccessでhttpにアクセスされたときに自動でhttpsに「www」のあり・なし統一して301リダイレクトする

WordPressの条件分岐タグでページを判別する

WordPressの投稿記事内に外部URLのOGPを取得してカードを作る

WordPressで取得したタイトルからHTMLタグを削除するthe_title_attribute()

【WordPress】ループ内で取得したパーマリンクやタイトルを変数に入れる

【WordPress】アイキャッチ画像のURLのみ取得して属性やクラスなどを自由にカスタムする

WordPressのループ内でアイキャッチ画像を表示させる
wp_get_attachment_image_src()を使う
wp_get_attachment_image_src()を使うと登録された画像のURLやサイズが配列で取得できます。
配列で取得できる画像URLの配列番号は変わらないので、その配列の0番を指定すれば画像URLが取得できます。
ループ内でアイキャッチ画像のURLを取得する
php
$thumbnail_id = get_post_thumbnail_id(); // アイキャッチ画像のIDを取得 $imgpath = wp_get_attachment_image_src($thumbnail_id ,'large'); // largeサイズの画像の詳細を取得 echo '<img src="' . $imgpath[0] . '" id="img1">';
まずはアイキャッチ画像のidを取得し、そのidを使って画像の詳細を取得します。
wp_get_attachment_image_src($thumbnail_id ,'large');はWordPressのループ内でアイキャッチ画像を表示させるで書いた、the_post_thumbnail('large');のように引数で画像サイズを指定できます。
最後にimgタグ内のsrcに取得したURLを入れれば完成です。
アイキャッチ画像がない場合、別の画像を表示させる2
php
<?php if(have_posts()):
while (have_posts()):
the_post();
if (has_post_thumbnail()) :
$thumbnail_id = get_post_thumbnail_id();
$imgpath = wp_get_attachment_image_src($thumbnail_id ,'large');
$thumb = $imgpath[0];
else :
$thumb = TEMPLATEPATH . '/img/nowprinting.jpg';
endif ; ?>
<img src="<?php echo thumb; ?>">
<?php
endwhile;
else : ?>
<p>表示できる記事がありません。</p>
<?php endif; ?>
下記記事の「アイキャッチ画像がない場合、別の画像を表示させる」で使ったコードとの合わせ技です。
アイキャッチ画像があるかないか調べて結果をどちらも$thumbに格納しているのでループ内で画像URLを切り替えることができます。



コメント