3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

インフォ・ラウンジAdvent Calendar 2023

Day 4

【WordPress】ACFで作ったブロックのデータを他のページで取得する

Last updated at Posted at 2023-12-03

この記事はインフォ・ラウンジAdvent Calendar 2023 4日目の記事です

前回は @yuuya08110 くんのRedwoodJSはいいぞおじさん「RedwoodJSはいいぞぉ」でした。
2日連続の投稿すごい!


この記事は?

今までやったことがなかった、他のページのブロックのデータを取得するのを
先日やったのでメモ:pencil:

前提

  • WordPress:6.3.2
  • Advanced Custom Fields PRO:6.2.4

ブロック(カスタムフィールド)の作り

acf/anchor

  • anchor:リピートフィールド
    • link:リンク(#を除いて指定する)
    • text:テキスト

ページの関係

  • aページ(slugをaとする)
    • anchorブロックを使う(ページ内アンカーとして使用)
  • bページ
    • A#リンクという別ページのアンカーとして表示したい

aページにアンカーブロックを入れて保存
*前後には段落があります
image.png

実装!

まずaページのIDを取得

$a_page = get_page_by_path('a');
$a_id = $a_page->ID;

ページIDからブロックの配列を取得

$post_blocks = parse_blocks(get_the_content('', false, $a_id));

これをvar_dumpしてみると以下のようになります。

array (size=5)
  0 => 
    array (size=5)
      'blockName' => string 'core/paragraph' (length=14)
      'attrs' => 
        array (size=0)
          empty
      'innerBlocks' => 
        array (size=0)
          empty
      'innerHTML' => string '
<p>テキスト</p>
' (length=40)
      'innerContent' => 
        array (size=1)
          0 => string '
<p>テキスト</p>
' (length=40)
  1 => 
    array (size=5)
      'blockName' => null
      'attrs' => 
        array (size=0)
          empty
      'innerBlocks' => 
        array (size=0)
          empty
      'innerHTML' => string '

' (length=2)
      'innerContent' => 
        array (size=1)
          0 => string '

' (length=2)
  2 => 
    array (size=5)
      'blockName' => string 'acf/anchor' (length=10)
      'attrs' => 
        array (size=3)
          'name' => string 'acf/anchor' (length=10)
          'data' => 
            array (size=10)
              ...
          'mode' => string 'edit' (length=4)
      'innerBlocks' => 
        array (size=0)
          empty
      'innerHTML' => string '' (length=0)
      'innerContent' => 
        array (size=0)
          empty
  3 => 
    array (size=5)
      'blockName' => null
      'attrs' => 
        array (size=0)
          empty
      'innerBlocks' => 
        array (size=0)
          empty
      'innerHTML' => string '

' (length=2)
      'innerContent' => 
        array (size=1)
          0 => string '

' (length=2)
  4 => 
    array (size=5)
      'blockName' => string 'core/paragraph' (length=14)
      'attrs' => 
        array (size=0)
          empty
      'innerBlocks' => 
        array (size=0)
          empty
      'innerHTML' => string '
<p>テキスト</p>
' (length=40)
      'innerContent' => 
        array (size=1)
          0 => string '
<p>テキスト</p>
' (length=40)

acf/anchorブロックだけ表示してみます。

    foreach ($post_blocks as $block) {
        if ($block['blockName'] === 'acf/anchor') {
            var_dump($block);
        }
    }

これをvar_dumpしてみるとdataの中にanchor_【index番号】textとanchor【index番号】_linkとして、
取得したいデータがあることがわかります。

array (size=5)
  'blockName' => string 'acf/anchor' (length=10)
  'attrs' => 
    array (size=3)
      'name' => string 'acf/anchor' (length=10)
      'data' => 
        array (size=10)
          'anchor_0_text' => string 'リンク01' (length=11)
          '_anchor_0_text' => string 'field_654c468b343e6' (length=19)
          'anchor_0_link' => string 'link01' (length=6)
          '_anchor_0_link' => string 'field_654c469a343e7' (length=19)
          'anchor_1_text' => string 'リンク02' (length=11)
          '_anchor_1_text' => string 'field_654c468b343e6' (length=19)
          'anchor_1_link' => string 'link02' (length=6)
          '_anchor_1_link' => string 'field_654c469a343e7' (length=19)
          'anchor' => int 2
          '_anchor' => string 'field_654c466b343e5' (length=19)
      'mode' => string 'edit' (length=4)
  'innerBlocks' => 
    array (size=0)
      empty
  'innerHTML' => string '' (length=0)
  'innerContent' => 
    array (size=0)
      empty

アンカーブロックのデータを取得する

<?php
    $anchor_list = []; //アンカーを配列として保存する用

    foreach ($post_blocks as $block) {
        if ($block['blockName'] === 'acf/anchor') {
            //anchorにアンカーリンクの個数が保存されているので、取得
            $count = $block['attrs']['data']['anchor'];
            for ($i = 0; $i < $count; $i++) {
                // テキストを配列$anchor_listの[index番号]['text']に保存
                $anchor_list[$i]['text'] = $block['attrs']['data']["anchor_{$i}_text"];
                // リンクを配列$anchor_listの[index番号]['link']に保存
                $anchor_list[$i]['link'] = $block['attrs']['data']["anchor_{$i}_link"];
            }
        }
    }
    // $anchor_listをforeachで出力
    if ($anchor_list):foreach ($anchor_list as $anchor):
    $a_page = get_page_by_path('a');
    $a_link = get_permalink($a_page->ID)
    ?>
      <?php echo $a_link . '#' . $anchor['link']; ?>
      <?php echo $anchor['text']; ?>
    <?php endforeach;endif; ?>

無事出力できた!
image.png

まとめ

  • ACFでできたブロックのデータを他のページで取得できる
  • リピートフィールドやそれと似た作りのフィールドだとちょっと大変
  • ブロックなので、もし何個も入ってる時はどうするの?という話もある

明日は @sakzw くんがZoomミーティングに参加中であるか判定する(Windows) #PowerShell - Qiitaを書いてくれるようです。
楽しみですね!

3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?