0

我已经在https://wordpress.stackexchange.com/上问过这个问题，但没有人回答。有类似的问题，但我认为它们是针对主题开发人员的，而不是针对那些只是使用某个主题并希望扩展其功能的人。

我使用特定主题在 Wordpress 中制作网页。现在，这个主题有一个预期的菜单标记：

<ul id=”primary-navigation-main”&gt;
    <li>
        <a href=”https://example.com/page1”&gt;Page 1</a>
    </li>
    <li>
        <a href=”https://example.com/page1”&gt;Page 2</a>
    </li>
    <li>
        <a href=”https://example.com/page1”&gt;Page 3</a>
    </li>
</ul>

在移动菜单上，愿望略有不同。在公司中，他们希望在按下菜单项时进行一些过渡。我在另一个（硬编码）菜单上解决了这样的问题：

<ul id=”primary-navigation-main”&gt;
    <li>
        <div class=”transition-div”&gt;</div>
        <a href=”https://example.com/page1”&gt;
            <p>Page 1</p>
        </a>
    </li>
    <li>
        <div class=”transition-div”&gt;</div>
        <a href=”https://example.com/page1”&gt;
            <p>Page 2</p>
        </a>
    </li>
    <li>
        <div class=”transition-div”&gt;</div>
        <a href=”https://example.com/page1”&gt;
            <p>Page 3</p>
        </a>
    </li>
</ul>

或者像这个jsfiddle 一样。

我不知道这是否是这种过渡的最佳解决方案，但它确实有效。

所以，我想在我想添加<div>的<li>之前<a>和中<a>添加<p>。我在摆弄with wp_nav_menu，wp_nav_menu_items但我没有成功。我需要注册<ul>还是其他？此外，似乎我将不得不使用 Walker 课程，但我不知道如何。

现在，因为我没有得到任何回应，我已经找到了原始主题标记的解决方案div（没有and p）。但问题仍然存在：如何将任意标记插入某个现有菜单（在我的情况下是所选主题的主菜单）。即进入每个菜单项li，然后进入每个链接a，保留菜单的 URL。

任何人都可以帮助我或简单地告诉我这是不可能的吗？我已经可以用来wp_nav_menu_items在菜单中插入一个项目。因此，我认为wp_nav_menu为更详细的工作提供了功能。

4

1 回答 1

1

在您的函数文件中添加以下代码

class AWP_Menu_Walker extends Walker_Nav_Menu {
    function start_el(&$output, $item, $depth=0, $args=[], $id=0) {
        $output .= "<li class='" .  implode(" ", $item->classes) . "'>";
 
        $output .= '<div class="transition-div"></div>'; //Put your content here
        
        if ($item->url && $item->url != '#') {
            $output .= '<a href="' . $item->url . '">';
        } else {
            $output .= '<span>';
        }
 
        $output .= $item->title;
 
        if ($item->url && $item->url != '#') {
            $output .= '</a>';
        } else {
            $output .= '</span>';
        }
 
        if ($args->walker->has_children) {
            $output .= '<i class="caret fa fa-angle-down"></i>';
        }
    }
}

在模板（或标题）中获取菜单的位置添加walker

wp_nav_menu([
    ...
    ...
    'walker' => new AWP_Menu_Walker()
]);
于 2021-06-18T13:06:01.807 回答