カスタムフィールドテンプレートを使う。カスタムフィールドの値がない時に表の列を非表示にする

やたら、タイトルが長くなってしまいました。作業用のメモ。
カスタムフィールドテンプレートを使って、表をつくる際に全ての投稿記事でカスタムフィールドが入力されていれば良いですが、値(key値)が空欄になる時があります。

表で作っていると、空欄でも表が作成されてしまうので、少しかっこ悪くなってしまいます。
そんな時には、簡単に、カスタムフィールドの値がない時に表の列を非表示にする方法があります。

表の作成

例えば、下記のような表を作ったとします。
カスタムフィールドは、それぞれ

店舗名 key=12345店
住所  key=東京都新宿区新宿
電話番号 key=00-0000-0000
定休日 key=空欄
お知らせ key=空欄
を入力します。

定休日、お知らせが
そのまま、カスタムフィールドテンプレートで表示すると、以下のようになります。
カスタムフィールド表示(省略1)

これを、定休日、お知らせが空欄だった場合には非表示とするようにつくります。
やり方は、tableタグで囲ってあるカスタムフィールドにPHPコードを追加してやるだけです。
[html]<?php if(get_post_meta( $post->ID, ‘空欄時に非表示にするカスタムフィールド’, true )): ?>
表示する項目
<?php endif; ?>
[/html]

例の場合だと、下記のようなコードをつくります。
CSSは、ご自身で作成下さい。

[html]/ 値がない場合に表を非表示にする /
<?php if(get_post_meta( $post->ID, ‘定休日’, true )): ?>
<tr>
<td class="data1">
定休日
</td>
[定休日]<br>
</td>
</tr>
<?php endif; ?>

<?php if(get_post_meta( $post->ID, ‘お知らせ’, true )): ?>
<tr>
<td class="data1">
お知らせ
</td>
[お知らせ]<br>
</td>
</tr>
<?php endif; ?>
/ ここまで /[/html]
カスタムフィールド表示(省略2)

この記事を書いた人

tsubasatwi( つばさ)

国立工業高専卒業(新居浜工業高等専門学校)
「イベント×IT×営業」のカスタマーサクセスマネージャーとして活躍。セールス→構築管理運用まで全体プロジェクト管理の豊富な経験あり。

・主にITに関するイベント集客/法人営業/開発を担当
・大手通信会社を中心にエンタープライズのIT導入を担当(B2B)

DMMで日本初の NoCodeサロン を運営
「NoCodeCamp プログラミングを使わないIT開発 」
https://lounge.dmm.com/detail/2549/