Advanced Custom Fields（通称:ACF）の使い方についての備忘録です。
この記事ではフィールドタイプ「ファイル」の設定と出力する方法について解説しています。
フィールド項目を入力するところからの解説となりますので、あらかじめご了承ください。
↓フィールドグループを新規追加するまでの手順はコチラに記載してあります。
Advanced Custom Fields – テキストを出力
ファイルのフィールド項目を入力
フィールドの項目を入力するところからやっていきます。
今回設定したフィールドの項目は以下の通り。
| フィールド項目 | 入力値 | 説明 |
|---|---|---|
| フィールドラベル | ファイル | 編集画面で表示される名前 |
| フィールド名 | file | サイトに表示するときに指定するフィールド名 |
| フィールドタイプ | ファイル | フィールドタイプを選択 |
| 説明 | ファイルを選択 | このフィールドに対する説明を入力 |
| 返り値 | ファイル 配列 | 出力する際の返り値のフォーマットを選択 |
| ライブラリ | 全て | ファイルアップロードボタンをクリックしたときの画像一覧の表示方法を選択 |
| 最大 ファイルサイズ | 100 MB | ファイルアップロードのファイルサイズの最小値・最大値を制限 |
入力が完了したら「公開」をクリックして保存します。
次に投稿画面にいきます。
投稿画面を表示すると先程設定したカスタムフィールドが表示されました。
投稿するファイルを選択します。
今回は例としてプラグインの「all-in-one-wp-migration-file-extension.zip」をアップロードしてみます。
ファイルが表示されました。
では公開します。
ACF ファイルフィールドの値を出力
ACF のカスタムフィールドの値を出力するにはthe_field( )関数を使います。
この関数はフィールドに入力した値をそのまま出力したい場合に用いられます。
出力せずに値だけを受け取りたい場合はget_field( )関数を使います。
この関数は値を出力しません。値だけを受け取るので、なにか加工してから表示させたいなどといった場合に用いられます。
それでは先程選択したファイルがどのように出力されるか試してみましょう。
まずは$file = get_field('file')で値を受け取り、var_dump($file)で中身を確認します。
フィールド項目、返り値のフォーマットを「ファイル 配列」としたので、変数の中身は、下記のような配列になっています。
array(21) {
["ID"]=>
int(68)
["id"]=>
int(68)
["title"]=>
string(38) "all-in-one-wp-migration-file-extension"
["filename"]=>
string(42) "all-in-one-wp-migration-file-extension.zip"
["filesize"]=>
int(20526)
["url"]=>
string(100) "http://localhost:8888/DemoSite/wp-content/uploads/2020/07/all-in-one-wp-migration-file-extension.zip"
["link"]=>
string(104) "http://localhost:8888/DemoSite/2020/07/22/advanced-custom-fields/all-in-one-wp-migration-file-extension/"
["alt"]=>
string(0) ""
["author"]=>
string(1) "1"
["description"]=>
string(0) ""
["caption"]=>
string(0) ""
["name"]=>
string(38) "all-in-one-wp-migration-file-extension"
["status"]=>
string(7) "inherit"
["uploaded_to"]=>
int(34)
["date"]=>
string(19) "2020-07-28 06:03:46"
["modified"]=>
string(19) "2020-07-28 06:03:46"
["menu_order"]=>
int(0)
["mime_type"]=>
string(15) "application/zip"
["type"]=>
string(11) "application"
["subtype"]=>
string(3) "zip"
["icon"]=>
string(67) "http://localhost:8888/DemoSite/wp-includes/images/media/archive.png"
}今回は投稿されたzipファイルをダウンロードするためのリンクを貼ってみます。
どうするかというと、aタグを使用することでダウンロードするリンクを作ることができます。
コードは以下のようになります。
<?php $file = get_field('file'); ?>
<a href="<?php echo $file['url']; ?>" download="<?php echo $file['filename']; ?>">zipファイルをダウンロード</a>- href属性にアップロードされたファイルのURLを指定
- download属性に設定されたファイル名が、ダウンロードされるファイルの名前
表示を確認してみます。
これでダウンロードするリンクが表示されました。
クリックしてダウンロードしてみます。
ダウンロードされました。
ダウンロードフォルダにもあることが確認できます。
以上です。
