将活动/当前类别添加到子菜单自定义帖子标题

Question

this is the code that I use to create a submenu that list all custom post I create in wordpress:

    <ul class="submenu">
        <img src="<?php bloginfo('template_directory'); ?>/images/submenu.png" alt="submenu" width="62" height="1" />
        <!-- List post types -->
        <?php
            $the_query = new WP_Query( 'post_type=artworks_post' );
            // The Loop
            while ( $the_query->have_posts() ) : $the_query->the_post();
            echo '<li id="submenu_link" class="submenu_item_link">';
            echo '<a  href="' .get_permalink(). '" > ';
            the_title();
            echo '</a>';
            echo '</li>';
            endwhile;
            // Reset Post Data
            wp_reset_postdata();
        ?> 
        <img src="<?php bloginfo('template_directory'); ?>/images/submenu.png" alt="submenu" width="62" height="1" />
    </ul>

For example my current post is artworks_post/project-coke but it doesn´t add current/active class to the title of it in the submenu (Project Coke title).

How can I add an active/current class to the title of the current post in the submenu?

The submenu is constructed that way to get the custom post...

Answer 1

Try my code ? :

Put this code in your functions.php

function if_current($s) {
    global $wp_query,$post;
    $current    = $wp_query->get_queried_object_id();
    $post_id    = $post->ID;
    if($current==$post_id){echo $s;}
}

So edit your code like :

<ul class="submenu">
    <img src="<?php bloginfo('template_directory'); ?>/images/submenu.png" alt="submenu" width="62" height="1" />
    <!-- List post types -->
    <?php
        $the_query = new WP_Query( 'post_type=artworks_post' );
        // The Loop
        while ( $the_query->have_posts() ) : $the_query->the_post();
        echo '<li id="submenu_link" class="submenu_item_link ';
        if_current('current');
        echo '">';
        echo '<a  href="' .get_permalink(). '" > ';
        the_title();
        echo '</a>';
        echo '</li>';
        endwhile;
        // Reset Post Data
        wp_reset_postdata();
    ?> 
    <img src="<?php bloginfo('template_directory'); ?>/images/submenu.png" alt="submenu" width="62" height="1" />
</ul>

Result :

<li id="submenu_link" class="submenu_item_link current">
<a href="http://webkunst.comeze.com/test/artworks_post/project-coke/"> Project Coke</a>
</li>

PS: you can add whatever if_current('text') in loop in your theme, This will show when $post->ID == $wp_query->get_queried_object_id() (if current)

So you can use class current in your CSS

Answer 2

You need to check which page (or category) you are currently on and add additional class to the submenu item which is active. You can use get_the_ID() to retrieve the ID of the current element in the WP loop.

So before this line:

echo '<li id="submenu_link" class="submenu_item_link">';

You would need to add a check if the current post id matches the post id and add a class to the li element which will show that.

Answer 3

I would suggest you use the WordPress Menu implementation. (Infos here and here )

It's a nice and easy "How it should be" approach for menu creation in WordPress and, for example, marks automatically the active items once you've used the wp_nav_menu function.

If you feel forced to stick to your approach, you ofc have to check if the current displayed post is equal to one of the posts you display in your loop and echo class like current or active.