2012-09-11 65 views
0

我試圖在wordpress中的導航菜單中添加div。 wp_nav_menu加載所有菜單項,但我不知道如何將div添加到結構中。我的目標是在菜單項懸停上彈出一個子菜單,並在子菜單塊頂部有一個箭頭圖像,使其看起來像一個方形文本氣球。我知道如何把它放在我想要的東西和所有東西上,但不知道如何在那裏獲得div。插入div到wp_nav_menu

現在,看起來像這樣

<ul class="menu"> 
<li> 
    <a> 
    <ul class="submenu"> 
    <li> 
    <a> 

而且我希望它看起來像這樣

<ul class="menu"> 
<li> 
    <a> 
    <ul class="submenu"> 
    <div class="pointer"> 
    <li> 
     <a> 

我怎樣才能做到這一點?

回答

2

最好的辦法是使用Walker Class。在functions.php文件添加此:

class Walker_Nav_Pointers extends Walker_Nav_Menu 
{ 
    function start_lvl(&$output, $depth = 0, $args = array()) 
    { 
     $indent = str_repeat("\t", $depth); 
     $output .= "\n$indent<ul class=\"sub-menu\">\n"; 
     $output .= "\n<div class=\"pointer\">\n"; 
    } 
    function end_lvl(&$output, $depth = 0, $args = array()) 
    { 
     $indent = str_repeat("\t", $depth); 
     $output .= "$indent</ul>\n".($depth ? "$indent</div>\n" : ""); 
    } 
} 

然後無論你調用你的導航菜單,將其添加到現有的參數:

<?php 
$navArgs = array('walker' => new Walker_Nav_Pointers()); 
wp_nav_menu($navArgs); 
?> 

上面的例子是未經測試,我可以」不保證它會直接進入大門,但它應該讓你開始。

有關WP Nav Menus Here的更多信息,以及有關Adding Custom Walkers Here的一些信息。

+0

工作就像一個魅力,謝謝! –