Aggiungere la classe all'elemento attivo e al suo genitore nel menu di navigazione

Question

Aggiungere la classe all'elemento attivo e al suo genitore nel menu di navigazione

5 set 2013, 00:26:51

Visualizzazioni: 22.9K

Voti: 2

Sto utilizzando il seguente codice per aggiungere il nome della classe "active" all'elemento corrente del menu:

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;
}

Questo funziona perfettamente, ma solo per gli elementi senza menu a discesa. Se c'è un elemento con elementi figli, non aggiungerà la classe active all'elemento genitore.

C'è un modo per modificare questo codice in modo che il filtro aggiunga una classe "active" sia al link corrente che al suo genitore?

Johann

867

menu filtri

Commenti

Non devi farlo...WP aggiunge già classi per questo come current-menu-item o current-ancestor-item...ecc...

User

5 set 2013 00:38:51

Ciao @splashingpixels, so che Wordpress aggiunge le sue classi personalizzate ma ho specificamente bisogno di aggiungere una classe chiamata "active".

Johann

5 set 2013 00:44:01

Posso chiederti perché deve essere proprio la parola active?

User

5 set 2013 00:45:30

Grazie per la tua rapida risposta. Sto sviluppando un tema utilizzando Bootstrap come base e gli stili base di Bootstrap. La denominazione delle classi è diversa rispetto a WordPress e vorrei creare un filtro prima di modificare gli stili core.

Johann

5 set 2013 01:00:23

Tutte le risposte alla domanda

Commenti

Ciao @splashingpixels. Ho provato il tuo codice ma non sembra funzionare. Ho controllato il codice sorgente e la classe "active" non viene aggiunta.

Johann

5 set 2013 01:01:15

Ho aggiornato la risposta, prova così..

User

5 set 2013 01:07:49

Grazie @splashingpixels, sei fantastico! Codice perfetto. Solo un'altra domanda, non so se sia possibile o se sia una limitazione di Wordpress. Con questo codice, ora tutti gli elementi genitore hanno la classe "active" quando necessario. C'è un modo per fare in modo che quando clicco su un elemento del dropdown, venga aggiunta anche a lui la classe active? In modo che la classe "active" sia aggiunta sia al genitore che al figlio?

Johann

5 set 2013 01:13:05

Sì, puoi farlo, vedi la risposta aggiornata... e per favore segnala come soluzione se ha funzionato per te... grazie.

User

5 set 2013 01:24:58

Sei il migliore, questo problema è risolto!

Johann

5 set 2013 01:28:56

User 100 · Accepted Answer · 2013-09-05T00:51:08Z

A seconda del contesto in cui ti trovi e basandoti sul codice che hai, puoi provare questo:

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;
}

AGGIORNAMENTO: se il codice sopra non funziona a causa dell'array come parametro per la funzione in_array per via della versione PHP, prova questo codice:

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;
}

Se vuoi che qualsiasi elemento corrente abbia la classe active, puoi fare così:

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;
}