主页 / 问题 / 687593
Accepted
siberian
Asked:2020-07-05 20:29:18 +0000 UTC2020-07-05 20:29:18 +0000 UTC

更改 php 代码 wp_nav_menu 以更改 html 标记

  • 772

有些项目有一个下拉菜单。要显示菜单，我使用wp_nav_menu。

根据现有设计，需要改变结构html。a将标签更改span为带有嵌套列表的菜单项的标签。那些。如果菜单项有嵌套列表，则它不能是链接。因此，您需要获得以下菜单结构：

<ul>
  <li><a href="">Parent item</a></li>
  <li class="menu-item-has-children">
     <span>Parent item</span>
     <ul>
       <li><a href="">text1</a></li>
       <li><a href="">text2</a></li>                             
     </ul>
  </li>
  <li><a href="">Parent item</a></li>
</ul>

如何更改代码wp_nav_menu以获得这样的菜单结构？

更新程序

有这样的解决办法。但是这段代码改变了整个标记，没有检查嵌套列表。

php

3 个回答

  1. Best Answer

    是不是这样：

    class menu_walker extends Walker_Nav_Menu {
function start_el(&$output, $item, $depth, $args) {
    global $wp_query;
    $indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';

    $class_names = $value = '';

    $classes = empty( $item->classes ) ? array() : (array) $item->classes;

    $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item ) );
    $class_names = ' class="'. esc_attr( $class_names ) . '"';

    $output .= $indent . '<li id="menu-item-'. $item->ID . '"' . $value . $class_names .'>';

    $attributes  = ! empty( $item->attr_title ) ? ' title="'  . esc_attr( $item->attr_title ) .'"' : '';
    $attributes .= ! empty( $item->target )     ? ' target="' . esc_attr( $item->target     ) .'"' : '';
    $attributes .= ! empty( $item->xfn )        ? ' rel="'    . esc_attr( $item->xfn        ) .'"' : '';
    $attributes .= ! empty( $item->url )        ? ' href="'   . esc_attr( $item->url        ) .'"' : '';


    $item_output = $args->before;
    if ( $args->walker->has_children && 0 === $depth ) {
        $item_output .= '<span>';
    } else {
        $item_output .= '<a' . $attributes . '>';
    }

    $item_output .= $args->link_before .apply_filters( 'the_title', $item->title, $item->ID );
    $item_output .= ( $args->walker->has_children && 0 === $depth ) ? ' </span>' : '</a>';
    $item_output .= $args->after;
    $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
}
}
    • 1

  2. 或者，您可以添加一个过滤器 - add_filter('wp_nav_menu', 'my_function') 到主题函数（在 function.php 文件中）。

    function replace_tag($block_menu) {

    // Выбираем все <a>...</a>
    preg_match_all('|<a(.*?)</a>|is', $block_menu,  $out_dat);

    // Проходим в цикле по всем выбранным тегам '<a>' 
    foreach( $out_dat[0] AS $out_d)
    {
        // если встретили класс "dropdown-toggle" то делаем 2 действия: получаем анкор и заменяем строку "<a .... </a>"  на нашу 
        if(strpos($out_d, 'dropdown-toggle'))
        {
            preg_match('|>(.*?)<|is', $out_d,  $ancor);
            $block_menu = str_replace($out_d, '<span>' . $ancor[1] . '</span>',  $block_menu);
        }
    }

    return $block_menu;
}
add_filter('wp_nav_menu','replace_tag');
    • 0

  3. 真的有必要改吗？向其添加代码functions.php是一个拐杖，可以说是服务器的额外处理。有一种更简洁的方法css：只需将一个类添加到输出链接，然后

    .inactiveLink {
   pointer-events: none;
   cursor: default;
}

    标签仍然存在，但是当您单击带有类的链接时不会发生任何事件，并且您不必削减过滤器（这在或多或少的大型项目中已经足够了）。

    • 0

相关问题