Aggiungere codice HTML personalizzato alla funzione wp_nav_menu

Question

Aggiungere codice HTML personalizzato alla funzione wp_nav_menu

14 lug 2013, 21:20:48

Visualizzazioni: 22.2K

Voti: 5

Vorrei implementare del codice HTML personalizzato alla funzione wp_nav_menu in WordPress in modo da poter aggiungere una finestra modale bootstrap a un link del menu di navigazione, ma non sono sicuro su come procedere. Il post https://stackoverflow.com/questions/12250866/how-to-add-custom-html-to-wp-nav-menu spiega in parte come farlo estendendo la classe walker.

Il mio obiettivo è creare il seguente markup utilizzando l'aiuto della classe walker per creare il codice HTML personalizzato alla fine.

<div class="menu-primary-navigation-container">
    <ul id="navigation" class="clearfix">
        <li id="menu-item-275" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-273 current_page_item menu-item-275">
            <a href="http://sandpit.jonathanbeech.co.uk/">Home</a>
        </li>
        <li id="menu-item-17" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-17">
            <a href="http://sandpit.jonathanbeech.co.uk/about/">Chi siamo</a>
        </li>
        <li id="menu-item-191" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-191">
            <a href="http://sandpit.jonathanbeech.co.uk/portfolio-two/">Portfolio</a>
        </li>
        <li id="menu-item-269" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-269">
            <a href="http://sandpit.jonathanbeech.co.uk/articles/">Articoli</a>
        </li>
        <li>
            <a href="#myModal" role="button" data-toggle="modal">Contatti</a>
        </li>
    </ul>
</div>

Sto avendo difficoltà a capire come modificare il codice start_el e end_el per ottenere il codice nell'ultimo elemento della lista poiché le mie competenze PHP non sono buone.

Qualche suggerimento?

class Custom_Walker_Nav_Menu extends Walker_Nav_Menu {
    function start_el ( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        // Copiare tutto il codice start_el dalla sorgente e modificarlo
    }

    function end_el( &$output, $item, $depth = 0, $args = array() ) {
        // Copiare tutto il codice end_el dalla sorgente e modificarlo
    }
}

Jonathan Beech

457

menu twitter bootstrap

Tutte le risposte alla domanda

s_ha_dum 65.5K · Accepted Answer · 2013-07-14T21:32:18Z

Per aggiungere quell'ultimo elemento alla lista, non hai bisogno di un Walker personalizzato. Esiste un hook che ti permetterà di aggiungerlo.

function add_last_nav_item($items) {
  return $items .= '<li><a href="#myModal" role="button" data-toggle="modal">Contatto</a></li>';
}
add_filter('wp_nav_menu_items','add_last_nav_item');

Non sarebbero comunque start_el e end_el quelli che dovresti modificare. Questi generano i singoli elementi della lista. Non è il posto giusto per aggiungere un altro elemento. Penso che probabilmente dovresti risalire alla classe genitore Walker di Walker_Nav_Menu per trovare un punto dove aggiungere nuovi elementi, ma non ne vale la pena solo per aggiungere elementi.

s_ha_dum

65.5K

14 lug 2013 21:32:18