• WordPress

Advanced custom fields で値が設定された時だけ表示する

Advanced custom fields でカスタムテンプレートを設定し、そこに値が与えられた時のみ、viewに値を表示したいという時。

例えば、wordpressサイトのtopページに求人のバナーを表示したいんだけど、
wordpressのカスタムフィールドを使ってお客さんの方でバナー画像とリンクを自由に設定したいという場合どするか？
なお、値を与えない場合は、何も表示されないものとする。

設定の流れ

• 1.

  Advanced custom fields で、カスタムフィールドを設定

• 2.

  get_field　で対象のfieldの値を取得し、html View側に持ってくる

• 3.

  もしfieldに値があれば、その値を表示するという条件分岐をする。

フィールドの値を、値があった場合のみ表示するための条件分岐

<?php if( get_field(‘フィールド名A’) or get_field('フィールド名B’) and get_field('フィールド名C’) ): ?>

<a href="<?php the_field('フィールド名C',$page_id); ?>"><img src="<?php the_field('フィールド名A'); ?>" ></a>
<a href="<?php the_field('フィールド名C',$page_id); ?>"><img src="<?php the_field('フィールド名B'); ?>" ></a>

<?php else: ?>
<?php #条件に当てはまらないので表示なし ?>
<?php endif; ?>

いろいろやり方があると思いますが、一番管理しやすく、お客様も利用しやすいと思うのが
値入力用の固定ページを用意してカスタムフィールドを設定する方法。

固定ページにadvanced custom fields でカスタムフィールドを設定したとして
(参考advanced custom fieldsの使い方)

バナー表示のfieldがbannerPc
リンク設定のfieldがbannerLink
固定ページのパスがtop-banner

とした場合

index.php側に渡す場合、こう書く

<?php #固定ページ TOPページバナー スラッグ top-banner を取得。the_fieldで表示
$page_id = get_page_by_path('top-banner');
?>
<?php if( get_field('bannerPc',$page_id) and get_field('bannerLink',$page_id) ): ?>

<a href="<?php the_field('bannerLink',$page_id); ?>"><img src="<?php the_field('bannerPc',$page_id); ?>" alt=“バナー”></a>

<?php else: ?>
<?php #条件に当てはまらないので表示していません。 ?>
<?php endif; ?>