WordPress 投稿のサムネイルが有る時と無い時の処理！
|
Web制作のこと
サムネイルの有無による処理を分岐させる。
スタッフブログなどを運営していると「投稿画面でアイキャッチ画像を挿入してサムネイル入れてね〜」と指示を流していても、うっかり忘れてサムネイル画像の分カラム落ちしている事よくありますよね。
まぁよくあるかどうかは置いておいて、アイキャッチ画像の設定してサムネイルを出力するならサムネイルが有る時と無い時の処理をしっかり書いておいて方が便利ですよ！という話です。
分岐の記述
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div> <a href="<?php the_permalink(); ?>"> <?php if ( has_post_thumbnail() ): ?><!-- if文による条件分岐 アイキャッチが有る時--> <?php the_post_thumbnail( 'thumbnail' ); ?> <?php else: ?><!-- アイキャッチが無い時--> <img src="ここにアイキャッチ設定していない時の画像を設定する" alt="アイキャッチがない時の画像です。" /> <?php endif; ?> </a> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> <p><?php the_excerpt(); ?></p> </div> <?php endwhile; else: ?> <p>記事情報がありません。</p> <?php endif; ?> |
仕組みとしては難しくないですね、サムネイルを置く場所にif文の条件分岐を書き足して「has_post_thumbnail()」でアイキャッチ設定していてサムネイル画像がある時と、「else」でそれ以外の処理を書くと=（イコール）サムネイルの処理がない時の処理になります。
アイキャッチが無い時の画像ですが、事前に共通画像を作成しておく必要があります。<?php echo get_template_directory_uri(); ?>が使えるのでテーマファイルのどこか分かりやすい場所にアップロードしておくと良いと思います。
|
1 |
img src="<?php echo get_template_directory_uri(); ?>/img/no-eyecatch.jpg" alt="アイキャッチがない時の画像です。" /> |
実際には上記のような書き方でサムネイル画像の代替画像を設定します。
