固定ページをカテゴリー的に使っているサイトを作っていました。
親ページが「魚」で、子ページが「鯛」「鮪」「鮭」というような。
で、親ページに、子ページのリンク付きバナーを表示しようと思いまして、試行錯誤した結果、以下のコードに落ち着きました。
ACFを使用して、子ページに child_banner_url という画像フィールド(戻り値:画像URL)を追加。
親ページ側では、そのバナーを表示します。
バナーは Bootstrap のグリッド内に配置するため、幅や高さは無視しちゃいました。
本当なら画像フィールドの戻り値を画像配列にしておいて、width、height も取り出して設定すべきなのでしょうけどね
<?php $args = array( 'post_parent' => get_the_ID(), 'post_status' => 'publish', 'post_type' => 'page' ); $children_array = get_children( $args ); if ( count( $children_array ) > 0 ) { echo '<div class="row">'; foreach ( $children_array as $child ) { $child_page_url = get_permalink( $child->ID ); $child_banner_url = get_field( 'child_banner_url', $child->ID ); $html = '<div class="col-sm-4">'; $html .= '<a href="' . esc_url( $child_page_url ) . '">'; $html .= '<img src="' . esc_url( $child_banner_url ) . '" alt="' . esc_html( $child->post_title ) . '"/>'; $html .= '</a>'; $html .= '</div>'; echo $html; } echo '</div>'; } ?>
zzz