web-dev-qa-db-ja.com

ナビゲーションメニューでアクティブな要素とその親にクラスを追加する

現在のメニュー項目にクラス名 "active"を追加するために、次のコードを使用しています。

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

function add_active_class($classes, $item) {
  if( $item->menu_item_parent == 0 && in_array('current-menu-item', $classes) ) {
    $classes[] = "active";
  }

  return $classes;
}

これは魅力として機能しますが、ドロップダウンのないアイテムに対してのみです。子を持つアイテムがある場合、それはアクティブアイテムを親アイテムに追加しません。

このコードを修正して、フィルタが現在のリンクとその親の両方に「アクティブ」クラスを追加する方法はありますか。

menusfilters
2
Johann

あなたがこれを必要としているコンテキストとあなたが持っているコードをうまく動かすことによって、あなたはこれを試すことができます：

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

function add_active_class($classes, $item) {
  $class_names = array( 'current-menu-item', 'current-menu-ancestor', 'current-menu-parent', 'current_page_parent',  'current_page_ancestor' );

  if( $item->menu_item_parent == 0 && in_array( $class_names, $classes) ) {
    $classes[] = "active";
  }

  return $classes;
}

更新：PHPバージョンのためにin_array関数の針として配列が原因で上記が機能しない場合は、以下のコードを試してください。

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

function add_active_class($classes, $item) {

  if( $item->menu_item_parent == 0 && 
    in_array( 'current-menu-item', $classes ) ||
    in_array( 'current-menu-ancestor', $classes ) ||
    in_array( 'current-menu-parent', $classes ) ||
    in_array( 'current_page_parent', $classes ) ||
    in_array( 'current_page_ancestor', $classes )
    ) {

    $classes[] = "active";
  }

  return $classes;
}

現在の項目でクラスをアクティブにしたい場合は、次のようにします。

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

function add_active_class($classes, $item) {

  if( in_array( 'current-menu-item', $classes ) ||
    in_array( 'current-menu-ancestor', $classes ) ||
    in_array( 'current-menu-parent', $classes ) ||
    in_array( 'current_page_parent', $classes ) ||
    in_array( 'current_page_ancestor', $classes )
    ) {

    $classes[] = "active";
  }

  return $classes;
}
2
user23654