WordPressのテーマファイルを開くと、if、else、endif という記述をよく見かけます。

はじめて見ると難しそうに感じますが、考え方はとてもシンプルです。

if は、条件によって表示する内容を切り替えるための仕組みです。

たとえば、

「アイキャッチ画像があるときだけ画像を表示する」
「検索結果ページでは本文ではなく抜粋を表示する」
「お問い合わせページ以外では広告を表示する」

といった処理は、WordPressテンプレートの中では if を使って実現されています。

この記事では、WordPressテンプレートでよく使われる if の基本を、初心者の方にも分かりやすく整理します。

ifとは

if は、条件分岐を行うための命令です。

簡単にいうと、

もし条件を満たすなら、これを表示する

という意味です。

たとえば、現在のページが個別投稿ページかどうかを判定したい場合は、次のように書きます。

<?php if ( is_single() ) : ?>
  <p>これは個別投稿ページです。</p>
<?php endif; ?>

このコードは、

現在のページが個別投稿ページなら、
「これは個別投稿ページです。」と表示する

という意味になります。

WordPressテンプレートで使うifの基本形

WordPressテンプレートでは、HTMLの中にPHPを差し込む形でコードを書くことが多いです。

そのため、次のような形の if がよく使われます。

<?php if ( 条件 ) : ?>

  条件を満たしたときに表示する内容

<?php endif; ?>

if で始まり、endif で終わる形です。

if の中に書かれた条件を満たした場合だけ、その中の内容が表示されます。

アイキャッチ画像がある場合だけ表示する例

たとえば、投稿にアイキャッチ画像が設定されている場合だけ画像を表示したいとします。

その場合は、次のように書きます。

<?php if ( has_post_thumbnail() ) : ?>
  <div class="post-thumbnail">
    <?php the_post_thumbnail(); ?>
  </div>
<?php endif; ?>

このコードの意味は次の通りです。

この投稿にアイキャッチ画像がある場合だけ、
アイキャッチ画像を表示する

has_post_thumbnail() は、現在の投稿にアイキャッチ画像が設定されているかどうかを調べる関数です。

アイキャッチ画像があれば true、なければ false のように判定されます。

つまり、アイキャッチ画像がない投稿では、この部分は何も表示されません。

elseとは

if と一緒によく使われるのが else です。

else は、「それ以外の場合」という意味です。

たとえば、アイキャッチ画像がある場合はその画像を表示し、ない場合は代替画像を表示したい場合は、次のように書けます。

<?php if ( has_post_thumbnail() ) : ?>

  <?php the_post_thumbnail(); ?>

<?php else : ?>

  <img src="<?php echo esc_url( get_template_directory_uri() . '/images/no-image.jpg' ); ?>" alt="No Image">

<?php endif; ?>

このコードは、次のように分岐しています。

アイキャッチ画像がある場合
  アイキャッチ画像を表示する

アイキャッチ画像がない場合
  代替画像を表示する

if だけの場合は、条件を満たした場合だけ処理できます。

else を使うと、条件を満たさなかった場合の処理も指定できます。

ifとelseの基本形

else を含めた基本形は次の通りです。

<?php if ( 条件 ) : ?>

  条件を満たした場合の表示

<?php else : ?>

  条件を満たさなかった場合の表示

<?php endif; ?>

WordPressのテンプレートでは、この形がかなり頻繁に出てきます。

たとえば、

検索結果ページなら抜粋を表示する
それ以外なら本文を表示する

という処理も、if と else で書けます。

<?php if ( is_search() ) : ?>

  <?php the_excerpt(); ?>

<?php else : ?>

  <?php the_content(); ?>

<?php endif; ?>

このコードの意味は次の通りです。

現在のページが検索結果ページの場合
  投稿の抜粋を表示する

それ以外の場合
  投稿の本文を表示する

検索結果ページでは本文全文を出すより、抜粋だけを表示した方が見やすいことがあります。

そのような表示の切り替えに if が使われます。

is_single()とは

is_single() は、現在のページが個別投稿ページかどうかを判定する条件分岐タグです。

たとえば、投稿一覧ページではタイトルをリンクにして、個別投稿ページではタイトルをリンクなしにしたい場合があります。

その場合は、次のように書けます。

<?php if ( is_single() ) : ?>

  <h1><?php the_title(); ?></h1>

<?php else : ?>

  <h2>
    <a href="<?php the_permalink(); ?>">
      <?php the_title(); ?>
    </a>
  </h2>

<?php endif; ?>

このコードの意味は次の通りです。

個別投稿ページの場合
  タイトルを文字だけで表示する

それ以外の場合
  タイトルをリンク付きで表示する

投稿一覧ページでは、タイトルをクリックして個別記事へ移動できる必要があります。

一方で、すでに個別投稿ページを開いている場合、そのタイトルをリンクにする必要はあまりありません。

そのため、is_single() を使って表示を切り替えます。

WordPressでよく使う条件分岐タグ

WordPressには、ページの種類や投稿の状態を判定するための関数が用意されています。

代表的なものは次の通りです。

is_single()

現在のページが個別投稿ページかどうかを判定します。

is_page()

現在のページが固定ページかどうかを判定します。

is_page( 'contact' )

スラッグが contact の固定ページかどうかを判定します。

is_home()

投稿一覧ページかどうかを判定します。

is_front_page()

サイトのフロントページかどうかを判定します。

is_search()

検索結果ページかどうかを判定します。

is_category()

カテゴリーアーカイブページかどうかを判定します。

has_post_thumbnail()

アイキャッチ画像が設定されているかどうかを判定します。

comments_open()

コメントが許可されているかどうかを判定します。

ifを読むときのコツ

WordPressテンプレートで if を見つけたら、まず次のように読むと分かりやすいです。

if の中に書かれている条件は何か
その条件を満たしたら何が表示されるのか
else がある場合、それ以外では何が表示されるのか
endif はどこにあるのか

特に大事なのは、if から endif までの範囲を見ることです。

<?php if ( 条件 ) : ?>

  この範囲が条件付きで表示される

<?php endif; ?>

この範囲の中にあるHTMLやPHPは、条件を満たした場合だけ表示されます。

ifは表示を切り替えるための道具

WordPressテンプレートの if は、単なるプログラミングの記述ではありません。

サイトの表示を柔軟に切り替えるための道具です。

たとえば、次のようなカスタマイズができます。

トップページだけ特別な見出しを表示する
固定ページではサイドバーを非表示にする
お問い合わせページでは広告を表示しない
特定カテゴリーの記事だけバナーを表示する
アイキャッチ画像がない場合は代替画像を表示する
検索結果ページでは抜粋だけを表示する

これらはすべて、if を使って実現できます。

まとめ

WordPressテンプレートの if は、条件によって表示内容を切り替えるための仕組みです。

基本形は次の通りです。

<?php if ( 条件 ) : ?>
  条件を満たした場合の表示
<?php endif; ?>

条件を満たさなかった場合の表示も指定したい場合は、else を使います。

<?php if ( 条件 ) : ?>
  条件を満たした場合の表示
<?php else : ?>
  条件を満たさなかった場合の表示
<?php endif; ?>

WordPressテンプレートでは、is_single()、is_page()、is_search()、has_post_thumbnail() などの条件分岐タグと組み合わせて使います。

まずは、if を見つけたら、

何を条件にしているのか
条件を満たしたら何を表示するのか
条件を満たさなかったら何を表示するのか

を確認してみてください。

これが分かるようになると、WordPressテンプレートの読み方が一気に分かりやすくなります。