自定義子菜單樣式的WordPress的導航

我必須設置一個相當奇怪的導航系統爲WordPress的動力網站。以下是示例代碼;自定義子菜單樣式的WordPress的導航

<nav> 
    <ul> 
     <li><a href="">Parent Menu</a> 
     <div class="dropdown"> 
      <div class="inner-menu-item"> 
       <dl> 
        <dt>Title tag for the sub-menus below</dt> 
        <dd><a href="">One</a></dd> 
        <dd><a href="">Two</a></dd> 
        <dd><a href="">Three</a></dd> 

        <dt>Title tag for another sub-menu</dt> 
        <dd><a href="">One</a></dd> 
        <dd><a href="">Two</a></dd> 
        <dd><a href="">Three</a></dd> 
       </dl> 
      </div> 
     </div> 
     </li> 

     <!-- similar structure as above --> 
     <li><a href="">Parent Menu</a> 
     <div class="dropdown"> 
      <div class="inner-menu-item"> 
       <dl> 
        <dt>Title tag for the sub-menus below</dt> 
        <dd><a href="">One</a></dd> 
        <dd><a href="">Two</a></dd> 
        <dd><a href="">Three</a></dd> 

        <dt>Title tag for another sub-menu</dt> 
        <dd><a href="">One</a></dd> 
        <dd><a href="">Two</a></dd> 
        <dd><a href="">Three</a></dd> 
       </dl> 
      </div> 
     </div> 
     </li> 
    </ul> 
</nav>

什麼應該是最好的方法來編寫一個Wordpress Nav代碼的上述設置？如果我可以選擇排除一些菜單項，這將是非常棒的。

我很滿意替代方法，我必須改變CSS，我對此很滿意。例如包裝在多個UL> LI中，而不是DIV和DL> DD。

來源

2011-08-20 Brajeshwar

很簡單。使用WP菜單，然後將類分配到只有標題的菜單。將該位置設置爲＃並使用CSS更改該類的光標類型。

此外，DIV類可以取出和CSS屬性可以給UL和LI第一UL李

來源

2011-08-20 17:25:15

使用[wp_nav_menu] 1函數內部產生一個菜單。使用它可以節省你很多努力，並且應該是wordpress的良好實踐。

您將有一個結構非常像這樣：

<div id="menu-wrapper"> 
    <ul id="menu"> 
    <li id="menu-item-1"> 
     <a href="your-page-1">Title</a> 
     <ul class="sub-menu"> 
     <li><a href="some-other-page">Title 2</a></li> 
     <li><a href="some-other-page">Title 2</a></li> 
     </ul> 
    </li> 
</ul> 
</div>

您可以通過繼承Walker_Nav_Menu並傳遞新的類的實例來wp_nav_menu定製這樣的結構。

來源

2011-08-20 19:51:47 karevn

恕我直言，你列出的標記聽起來不是語義的。相反，你可以使用ul/li。從搜索引擎的角度考慮這一點，使用Web開發人員工具欄刪除CSS。您可以進一步參考w3c。我正在寫作，因爲您有權修改標記。

Wordpress在外觀選項卡下有菜單選項，您可以使用它來設置herarchy。它會給你一個無序的列表。現在剩下的就是做CSS的工作。

這是一個很好的鏈接，可以幫助您獲得正確的CSS。看看this尋求關於CSS的幫助。

來源

2011-08-21 20:44:27

自定義子菜單樣式的WordPress的導航

回答

相關問題