Question

我使用html代码创建了一个下拉菜单：

[code]

<ul>
  <li><a href="#">Home</a></li>
  <li><a href="#">About</a>
    <ul>
    <span class="drop-down-menu-pointer"></span>
    <ul>
      <li><a href="#" >a</a></li>
      <li><a href="#">b</a></li>
      <li><a href="#">c</a></li>
    </ul>
    </ul>
  </li>
</ul>
[/code]

我希望将其转换为wordpress导航菜单，但我在使用wordpress菜单创建“span标签”时遇到问题。有人可以帮我这个吗？

Answer 1

Wordpress创建的菜单如下所示：

<ul id="main-menu" class="menu">
    <li id="menu-item-1234" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-33 current_page_item menu-item-1234">
        <a href="http://www.site.nl/">home</a>
    </li>
    <li id="menu-item-1235" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1235">
        <a href="http://www.site.nl/cursussen/">cursussen</a>
        <ul class="sub-menu">
        <li id="menu-item-1244" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1244">
                <a href="http://www.site.nl/cursussen/">cursus overzicht</a>
            </li>
        <li id="menu-item-1237" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1237">
                <a href="http://www.site.nl/maatwerk/">maatwerk</a>
            </li>
        </ul>
    </li>
    <li id="menu-item-1238" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1238">
        <a href="http://www.site.nl/nieuws/">tips en tricks</a>
    </li> 
</ul>

您可以依赖大量的课程和结构来完成您想要的跨度。例如，有一些像这样的CSS：

ul li ul {
    /*drop-down-menu-pointer styling here, for example, if 
        your main menu has a height of 20 px, this might work*/

    top: -20px;
    padding-top: 20px;
    background-image: url('arrowurl.jpg');
    background-position: top right;
    background-repeat: no-repeat;

    /* And you might have to do something with the position attribute */
}

我猜需要一些调整，但它应该让你到那里。另外，查看http://codex.wordpress.org/Function_Reference/wp_nav_menu所有选项，也许会有所帮助。

在wordpress的下拉菜单中添加span

1 个答案: