しばらく別の仕事で離れていたが、パソコン遊びに帰ってきた。
WordPressでLP形式のトップページを作成している際、
Advanced Custom Fields（ACF）で設定した価格フィールドが front-page.php（トップページ） から取得できない問題に遭遇しました。
編集画面がないので、仕方ない気もします。
最終的には ACFが保存している投稿IDと、テンプレート側で参照している投稿IDが一致していない ことが原因でした。
この記事では
- 起きていた現象
- 調査の手順
- 実際の解決方法
をまとめます。
環境
- WordPress
- Advanced Custom Fields
- 独自テーマ
- front-page.php を使用したトップページ
##やりたかったこと
トップページの価格表示を、管理画面から変更できるようにしたい。
例
発売価格：5,500円
これを ACFのフィールドから管理したい。
ACF設定
フィールドグループ
フィールド名
default_price
ロケーションルール
固定ページ ＝ トップページ
管理画面では次のように入力できる状態にした。
発売価格
5500
テンプレート側のコード
front-page.php
<?php if (get_field('default_price')) : ?>
<p class="product-price">
発売価格：<?php the_field('default_price'); ?>円
</p>
<?php endif; ?>
しかし、画面には何も表示されなかった。
切り分け
まずテンプレートが読み込まれているか確認。
<div>FRONT-PAGE.PHP が読まれています</div>
これは表示されたため、
front-page.php は正常に読み込まれていることが分かった。
次に疑ったこと
ACFが保存している 投稿ID と
テンプレートが参照している 投稿ID が一致していない可能性。
固定ページ編集URLを確認。
/wp-admin/post.php?post=24&action=edit
この場合
post_id = 24
である。
投稿IDを直接指定してみる
<?php
$price = get_field('default_price', 24);
?>
<?php if ($price) : ?>
<p class="product-price">
発売価格：<?php echo esc_html($price); ?>円
</p>
<?php endif; ?>
これで 正常に表示された。
原因
ACFは
post_meta
として 特定の投稿IDに保存される。
しかし front-page.php では
現在の投稿IDが必ずしもその固定ページとは限らない。
そのためget_field('field_name')だけでは値が取得できない場合がある。
解決方法
- 固定ページを作成、IDを指定して取得する。
- ACFの編集画面からその固定ページを紐づける
<?php
$price = get_field('default_price', 24);
?>
<?php if ($price) : ?>
<p class="product-price">
発売価格：<?php echo number_format((int)$price); ?>円
</p>
<?php endif; ?>
number_formatを使う理由
管理画面では
5500
のように数字だけ入力し、
表示時に整形する。
number_format((int)$price)
これにより
5500 → 5,500
となる。
まとめ
今回のポイントは次の通り。
- ACFの値は 投稿IDに紐づく
- front-page.php は必ずしもその投稿IDを参照していない（そらそうだ）
- 必要に応じて 投稿IDを指定して get_field() する