it-swarm.com.de

Wie füge ich benutzerdefinierten Code in die Struktur wp_nav_menu ein?

Ich konnte <?php wp_nav_menu( array( 'theme_location' => 'primary-menu', 'container' => false ) ); ?> verwenden, um das Menü innerhalb meines Themas zu erstellen. Mit 'items_wrap' rumgespielt, aber es wurde nicht richtig angezeigt.

Ich muss ein Bild und Container Div in das Untermenü Ul vor dem Li hinzufügen. Dies ist die Struktur, die ich möchte:

    <ul id="nav">
    <li><a href="#">Page</a>
        <ul>
            <img src="<?php bloginfo('template_directory'); ?>/images/nav_ul_tab.png" class="nav_ul_tab" />
            <div class="nav_spacer">
                <li><a href="#">Sub Page</a></li>
                <li><a href="#">Sub Page</a></li>
                <li><a href="#">Sub Page</a></li>
            </div>
         </ul>
    </li>
   </ul>
1
Luke

Was Sie wollen, ist ungültiges Markup. Die einzigen Kinder, die eine ul haben kann, sind li. Verwenden Sie stattdessen CSS:

#nav ul
{
    padding-top:    40px; /* Your image size. */
    background:     url(/path/to/your/image/img.png) top center no-repeat transparent;
}
5
fuxia

Wir können das Bild über Jquery einfügen. Hier ist der Code. Bevor Sie diesen Code ausführen, vergewissern Sie sich, dass JQuery JavaScript auf Ihrer Seite geladen ist.

<script type="text/javascript">
   jQuery(document).ready(function(){
        jQuery("#nav li ul .nav_spacer").before('<img src="<?php bloginfo('template_directory'); ?>/images/nav_ul_tab.png" class="nav_ul_tab" />')
   });
</script>
0
Manimaran