ACF の「先頭に追加(prepend )」を使って、ユーザーのSNSリンクを動的に作成する

  • WordPress

Advanced Custom Fields(以下 ACF ) ではget_field()を使って項目を取得することができますが、get_field_object()を使うと項目設定の詳細を取得することができます。これを使って、汎用的なものを作ってみます。

やること

今回は「ユーザーのメタフィールドにSNSのアカウントを追加できるようにして、それぞれ出力したいところでアカウントのURLを表示させる」というのを作成してみます。

ACF の設定

SNS を一つのグループとして作成したいので、フィールド「グループ」を作成し、その中で作成したいSNSの数だけフィールド「テキスト」を作成します。

さらに、「先頭に追加」欄をSNSのURLとしておきます。このURLは出力時で使うので、「URL/ユーザーアカウント」でアクセスできるような形にしておいてください。

今回は執筆者のメタフィールドになるので、実際に執筆するユーザーにのみこのフィールドを追加します。なので、ルールは「権限グループが Author と等しい」にしておきます。

これで、執筆者権限のユーザーを作成すると下記のようなフィールド入力欄ができているはずです。

テーマ側での出力

ユーザーのメタフィールドを get_field() で取得するには

まず ACF の関数について確認しておきます。ユーザーメタはget_field()で取得するときに第二引数にuser_ユーザーIDの文字列を入れることで、そのユーザーのメタを取得することができます。今回はsnsというフィールドを作成したので、

$user_id = なんとかしてユーザーIDを取得する;
get_field('sns', "user_${user_id}");

のような形で取得することになります。ユーザーIDの取得に関しては色々やり方がありますが、ここでは割愛します。

ただこれだけでは「先頭に追加」の欄の情報を取得することができません。ここに追加した URL と連結してユーザーの SNS アカウントページに飛ばしたいので、get_sub_field_object('サブフィールドのメタキー')で取得します。これらを組み合わせてリンクを作成していきます。

関数の作成

先ほどの ACF の関数を使って SNS リンクを作成する関数を作ります。functions.php にて定義します(かなり限定的な関数になりますが…)

/**
 * ACF で作成したユーザーメタの「グループ:SNS」の項目の
 * prepend に指定してある URL と SNSアカウント を連結して URL を生成する
 * @param {string} ユーザーID
 * @return {array} snsのリンク配列
 */
 function get_sns_links($user_id) {
   $sns_key = 'sns';
   $sns_links = [];
   $user_id_acf = "user_${user_id}";
   while (have_rows($sns_key, $user_id_acf)) {
     the_row();
     foreach (get_field($sns_key, $user_id_acf) as $key=>$account) {
       $sub_field_object = get_sub_field_object($key);
       // account が設定されていれば追加
       if ($account) {
         $sns_links[$key] = $sub_field_object['prepend'] . $account;
       }
     }
   }
   return $sns_links;
 } 

have_rows()を使わないとget_sub_field_object()に値がセットされなかったので、ここでは1ループしかしてませんが使っています。内部でどういう処理をしているかまでは見なかったのですが、もしかするともっと簡略化できるかもしれません。

これを使うと、

[
  'twitter' => https://twitter.com/設定したID,
  'facebook' => https://facebook.com/設定したID
]

のような配列を生成できるようになります。

出力

先ほどの関数を使って、まず single.php で出力してみます。single.php でユーザーの情報はget_the_author_meta('ID')などで取得できるので、

<?php
  $user_id = get_the_author_meta('ID');
  foreach ( get_sns_links( $user_id ) as $key => $url ): 
?>
  <a href="<?= $link ?>"><?= $key ?></a>
<?php endforeach ?>

のような感じで出力します。

これで SNS アカウントの出力が全て動的にできるので、たとえば Instagram のアカウントも追加できるようにしたいな〜という時に、同じ要領で ACF に追加すれば、出力側は何もいじらなくてもhttps://instagram.com/設定したIDのリンクが表示されるようになります。