获取父ID的子页面并显示自定义图像字段以及WordPress中页面的链接

Question

我需要获取子页面列表,但我需要排除第一个孩子.我还需要显示一个名为'page_icon'的自定义图像字段,其中包含网址和页面标题.这将作为将在每个子页面上显示的子菜单.每个菜单项都需要将当前类附加到a标记.我已经尝试了许多不同的方法并没有运气,因为我的技能水平充其量只是初学者.

父ID是1064,自定义字段称为"page_icon",它是使用ACF设置的

当前菜单硬编码到编辑器中,html如下所示: -

<div id="attachment_1306" style="width: 160px" class="wp-caption alignleft"><a class="icon on" href="http://www.domain.co.uk/category/category/category/"><img class="wp-image-1306 size-thumbnail" title="Policy Manager" src="http://www.domain.co.uk/wp-content/uploads/2013/05/docs-150x150.png" alt="" width="150" height="150" /></a><p class="wp-caption-text">Policy Manager</p></div>

 <div id="attachment_1297" style="width: 160px" class="wp-caption alignleft"><a class="icon" href="http://www.domain.co.uk/category/category/category/"><img class="wp-image-1297 size-thumbnail" title="Risk Manager" src="http://www.domain.co.uk/wp-content/uploads/2013/05/risk-150x150.png" alt="" width="150" height="150" /></a><p class="wp-caption-text">Risk Manager</p></div>

 <div id="attachment_1307" style="width: 160px" class="wp-caption alignleft"><a class="icon" title="Controls Manager" href="http://www.domain.co.uk/governance-risk-and-category/category/category/"><img class="wp-image-1307 size-thumbnail" title="Controls Manager" src="http://www.domain.co.uk/wp-content/uploads/2013/05/controls-150x150.png" alt="" width="150" height="150" /></a><p class="wp-caption-text">Controls Manager</p></div>

 <div id="attachment_1301" style="width: 160px" class="wp-caption alignleft"><a class="icon" title="Incident Manager" href="http://www.domain.co.uk/category/category/category/"><img class="wp-image-1301 size-thumbnail" title="Incident Manager" src="http://www.domain.co.uk/wp-content/uploads/2013/05/incident-150x150.png" alt="" width="150" height="150" /></a><p class="wp-caption-text">Incident Manager</p></div>

 <div id="attachment_1289" style="width: 160px" class="wp-caption alignleft"><a class="icon" title="Workflow Manager" href="http://www.domain.co.uk/category/category/category/"><img class="wp-image-1289 size-thumbnail" title="Workflow Manager" src="http://www.corestream.co.uk/wp-content/uploads/2013/05/workflow-150x150.png" alt="" width="150" height="150" /></a><p class="wp-caption-text">Workflow Manager</p></div>

但是在更新页面图标方面这不是用户友好的,因为您必须将其复制并粘贴到每个子页面中.

请有人帮帮我？

Answer 1

在主题目录中创建一个名为solutions_menu.php的文件(/wp-content/themes/your-theme/solutions_menu.php).此文件将包含菜单,并将包含在您的页面中.

编辑:

我用foreach循环替换了for循环.然后我在post type == page中添加了另一个ACF字段来控制是否在菜单中显示页面.它是一个简单的布尔(true/false)字段,名称为"appear_in_solutions_menu".我不确定这是解决问题的最佳方法,但它至少有效.

以下是使用以下代码的工作示例:http://japmag.net/24909031/？page_id = 6

solutions_menu.php

<?php

# Parent ID
$parent_id = 1064;

# Arguments for the query
$args = array(
    'post_parent' => $parent_id,
    'post_type'   => 'page', 
    'posts_per_page' => -1,
    'post_status' => 'publish' 
    ); 

# The parent's children
$kids = get_children( $args );

# Current pages ID
$page_ID = get_the_ID();

# Start iterating from 1, to skip first child
foreach( $kids as $kid ) {

    # Set variables
    $id = $kid->ID;
    $url = get_permalink( $id );
    $page_icon_array = get_field( 'page_icon', $id );
    $page_icon = $page_icon_array[ 'url' ];
    $title = $kid->post_title;
    $show = get_field( 'appear_in_solutions_menu' , $id );

    # Make sure the page shoul be in the menu
    if( $show ) {

        # If the current page ID matches the ID of the child, then $current will contain " on", which will be used to apply the class "on" to the anchor-element
        $current = ( $page_ID == $id ) ? " on" : "";

        # Echo out the menu ?>

        <div style="width: 160px" class="wp-caption alignleft">

            <a class="icon<?php echo $current?>" href="<?php echo $url?>">

                <img class="size-thumbnail" title="<?php echo $title ?>" src="<?php echo $page_icon; ?>" alt="" width="150" height="150" />

            </a>

            <p class="wp-caption-text"><?php echo $title ?></p>

        </div>

    <?php 

    }

}

?>

现在替换不同页面文件中的硬编码菜单

<?php get_template_part( 'solutions_menu' ); ?>

这将包括页面中的菜单,并希望动态填充正确的数据.因此,如果您需要更改菜单,只需更改solutions_menu.php,包含它的所有页面都将受到影响.我希望我能正确理解这个问题.我现在在工作,所以我还没能测试代码.