web-dev-qa-db-ja.com

カスタム投稿タイプの親のcurrent-menu-itemクラス

私のメニューとカスタム投稿タイプに問題があります。

カスタム投稿タイプの "services"があります。サービスという新しいページを作成しました。そのページに、そのカスタム投稿タイプのすべての投稿のリストが表示されます。 current-menu-itemクラスは意図したとおりに動作しています。

しかし、問題は私がサービスの1つをクリックしてmysite.com/services/service-1に行くと、メニューのサービスページからcurrent-menu-itemが消えることです。私はこの最新の投稿がサービスページの子であることを示す必要があります。

すべてのメニュー項目は同じHTMLを持ちます。

<li id="menu-item-23" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-23"><a href="http://localhost/wordpress/sluzby/">Služby</a></li>

このリンクを親としてスタイル設定するために使用できるCSSクラスはありません。 current-menu-parentまたは何かのようなもの。どうすればこれを修正できますか？ありがとう。

custom-post-typesmenuspost-class
1
Richard Mišenčík

私は通常このケースを説明するために私のプラグインに以下の親変数、フィルタとメソッドを含めます。これが「正しい」やり方であるかどうか私は確信が持てませんでしたが、javascriptを使って適用するよりも気分がいいです。

class Plugin_Name {
    private $parent = 'services'; // ideally this is a setting in your plugin, not a hard-coded variable in case the page slug changes

    function __construct() {
        // Add classes to 'parent'
        add_filter( 'nav_menu_css_class', array( &$this, 'nav_parent_class' ), 10, 2 );
    }

    function nav_parent_class( $classes, $item ) {

        if ( $this->nicename == get_post_type() && ! is_admin() ) {
            global $wpdb;

            // remove any active classes from nav (blog is usually gets the currept_page_parent class on cpt single pages/posts)
            $classes = array_filter($classes, ($class == 'current_page_item' || $class == 'current_page_parent' || $class == 'current_page_ancestor'  || $class == 'current-menu-item' ? false : true ));

            // get page info
            // - we really just want the post_name so it cane be compared to the post type slug
            $page = get_page_by_title( $item->title, OBJECT, 'page' );

            // check if slug matches post_name
            if( $page->post_name == $this->parent ) {
                $classes[] = 'current_page_parent';
            }

        }

        return $classes;
    }
}

あなたの要求に従って、非プラグインルート。上記のクラスから適応させただけで、エラーのテストはしていませんが、少なくとも正しい方向に進むはずです。

add_filter( 'nav_menu_css_class', 'nav_parent_class', 10, 2 );

function nav_parent_class( $classes, $item ) {
    $cpt_name = 'service';
    $parent_slug = 'services';

    if ( $cpt_name == get_post_type() && ! is_admin() ) {
        global $wpdb;

        // remove any active classes from nav (blog is usually gets the currept_page_parent class on cpt single pages/posts)
        $classes = array_filter($classes, ($class == 'current_page_item' || $class == 'current_page_parent' || $class == 'current_page_ancestor'  || $class == 'current-menu-item' ? false : true ));

        // get page info
        // - we really just want the post_name so it cane be compared to the post type slug
        $page = get_page_by_title( $item->title, OBJECT, 'page' );

        // check if slug matches post_name
        if( $page->post_name == $parent_slug ) {
            $classes[] = 'current_page_parent';
        }

    }

    return $classes;
}
5
Joey Yax

最終コード：

function nav_parent_class($classes, $item) {
    $cpt_name = 'services';
    $parent_slug = 'sluzby';

    if ($cpt_name == get_post_type() && !is_admin()) {
        global $wpdb;

        // get page info (we really just want the post_name so it can be compared to the post type slug)
        $page = get_page_by_title($item->title, OBJECT, 'page');

        // check if slug matches post_name
        if( $page->post_name == $parent_slug ) {
            $classes[] = 'current_page_parent';
        }

    }

    return $classes;
}

add_filter('nav_menu_css_class', 'nav_parent_class', 10, 2);
1
Richard Mišenčík

このコードは、あなたが管理パネルにネストされたメニュー構造を持っていない場合に限り、あなたの子供CPT、カスタム分類法あるいはデフォルト単一ポストの親項目メニューにクラス 'current-menu-item'を追加します - 'レベル0'がある場合のみメニュー。たとえば、商品グリッドを表示するページ商品があり、単一の商品にアクセスした場合、WPには親メニュー項目は表示されません。以下のコードはこれを改善します。

function additional_active_item_classes( $classes = array(), $menu_item = false ) {
    // custom taxonomy
    if ( $menu_item->title == 'Custom Tax Name Page' && is_tax('custom_tax') ) {
        $classes[] = 'current-menu-item';
    }
    // custom post type single
    if ( $menu_item->title == 'Custom Post Type Page' && is_singular('products') ) {
        $classes[] = 'current-menu-item';
    }
    // blog post single
    if ( $menu_item->title == 'Blog Page' && is_singular('post') ) {
        $classes[] = 'current-menu-item';
    }
    return $classes;
}
add_filter( 'nav_menu_css_class', 'additional_active_item_classes', 10, 2 );
1
Marek

通常、ナビゲーションの親項目に追加されたクラスの.current-menu-ancestorがあります。

それがない場合はこの記事を見ている： どのようにWordpressのカスタム投稿タイプのメニューに 'current-menu-ancestor'クラスを含めるには？

0
Joe