Advanced Custom Fields – 数値

ACF数値

Advanced Custom Fields(通称:ACF)の使い方についての備忘録です。
この記事ではフィールドタイプ「数値」の設定と出力する方法について解説しています。

フィールド項目を入力するところからの解説となりますので、あらかじめご了承ください。

↓フィールドグループを新規追加するまでの手順はコチラを参照してください
Advanced Custom Fields – テキストを出力

数値のフィールド項目を入力

フィールドの項目を入力するところからやっていきます。

ACF数値フィールド項目を入力

今回設定したフィールドの項目は以下の通り。

フィールド項目入力値説明
フィールドラベル商品価格編集画面で表示される名前
フィールド名numサイトに表示するときに指定するフィールド名
フィールドタイプ数値フィールドタイプを選択
説明このフィールドは商品の金額を入力しますこのフィールドに対する説明を入力
プレースホルダーのテキストここに金額を入力してください入力欄に表示されるテキスト
先頭に追加金額入力欄の先頭に表示されるテキスト
末尾に追加入力欄の末尾に表示されるテキスト
最小値100最小値を入力

入力が完了したら「公開」をクリックして保存します。

数値フィールド入力欄

投稿画面を表示すると先程設定したカスタムフィールドが表示されました。
仮に入力を「10」としてみましょう。

数値バリデーション

先程最小値を「100」としたので、しっかりとバリデーションがかかりました。

では、入力する値を直します。
今回は値を「1000」として公開をしました。

数値1000

ACF 数値フィールドの値を表示する

ACFのカスタムフィールドの値を出力するにはthe_field( )関数を使います。
先程入力した数値を表示させたいところに下記コードを記述します。

<?php the_field('num'); ?>

確認してみます。

ACFで出力した数値1000

これで数値が表示されました。

今回は商品価格なので数字の千の位ごとに「,」を入れたいと思います。

どうするかというと ACF の関数get_field( )で値を取得し、PHP関数のnumber_format( )でフォーマットします。

このPHP関数はパラメータが 1 つだけ渡された場合、千の位ごとにカンマ 「,」 が追加され、小数なしでフォーマットしてくれる関数になります。

コードは以下のようになります。

<?php
$price = number_format(get_field('num'));
echo $price . '円';
?>

ついでに「円」も一緒に表示させるようにしました。
では確認してみます。

フォーマット後の,画像

千の位の間に「,」が入りました。

以上です。

この記事を書いた人

けーた

高校卒業してから15年間勤めた会社を退職→脱サラしてWeb制作。
現在はWordPressサイト構築とShopifyストア構築をメインに、副業で物販をやっています。