remove li class & id for menu items and pages list

我与影子孤独终老i 提交于 2020-01-11 15:26:11

问题


Example of WordPress default CSS class output:

<li id="menu-item-55" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-55">

<li class="page_item page-item-37">

The menu and pages list item come with various own li class and id.

How to remove them in functions.php file for the menu and for the pages list?


回答1:


You should be able to remove them by hooking into a couple of filters and returning empty arrays or strings rather than new classes or ids:

add_filter('nav_menu_css_class', 'my_css_attributes_filter', 100, 1);
add_filter('nav_menu_item_id', 'my_css_attributes_filter', 100, 1);
add_filter('page_css_class', 'my_css_attributes_filter', 100, 1);
function my_css_attributes_filter($var) {
  return is_array($var) ? array() : '';
}

If you wanted to keep particular classes you could do something like this:

function my_css_attributes_filter($var) {
  return is_array($var) ? array_intersect($var, array('current-menu-item')) : '';
}



回答2:


this is an addition on top of Richard answer.

in case you want to change the current-menu-item class to something else.

        add_filter('nav_menu_css_class', 'my_css_attributes_filter', 100, 1);
        add_filter('nav_menu_item_id', 'my_css_attributes_filter', 100, 1);
        function my_css_attributes_filter($var) {
            if(is_array($var)){
                $varci= array_intersect($var, array('current-menu-item'));
                $cmeni = array('current-menu-item');
                $selava   = array('selectedmenu');
                $selavaend = array();
                $selavaend = str_replace($cmeni, $selava, $varci);
            }
            else{
                $selavaend= '';
            }
        return $selavaend;
        }



回答3:


Here is a fix that I've come up with. It removes all the id's and classes from the wp_nav_menu, but allows you to come up with your own "approved" list of classes and/or id's. It also changes the lengthy "current-menu-item" to "active". If you prefer to keep the the default WordPress CSS styles, just delete that section of the code. For the sake of keeping this post minimal, here are the links to the pastebin with the code:
http://pastebin.com/W16cxDfY - for your functions.php file
http://pastebin.com/CGx4aprf - for your template, wherever the menu goes




回答4:


simply add_filter('nav_menu_item_id', '__return_false'); for menu item id




回答5:


An addition to Richard's answer: We need to clean up the empty classes left behind:

//Strip Empty Classes
add_filter ('wp_nav_menu','strip_empty_classes');
function strip_empty_classes($menu) {
    $menu = preg_replace('/ class=(["\'])(?!active).*?\1/','',$menu);
    return $menu;
}



回答6:


If you just want to remove all the list classes and id's, add this to functions.php

add_filter('nav_menu_item_id', 'filter_menu_id');
add_filter( 'nav_menu_css_class', 'filter_menu_li' );
function filter_menu_li(){
    return array('');   
}
function filter_menu_id(){
    return; 
}



回答7:


My solution:

$defaults = array(
    'theme_location'  => '',
    'menu'            => '',
    'container'       => '',
    'container_class' => '',
    'container_id'    => '',
    'menu_class'      => '',
    'menu_id'         => '',
    'echo'            => false, // param important
    'fallback_cb'     => 'wp_page_menu',
    'before'          => '',
    'after'           => '',
    'link_before'     => '',
    'link_after'      => '',
    'items_wrap'      => '',
    'depth'           => -1,
    'walker'          => ''
);

ob_start();
echo preg_replace( '#<li[^>]+>#', '<li>', wp_nav_menu( $defaults ) );
$mainNav = ob_get_clean();

// In the page :
echo $mainNav;



回答8:


Best way to remove li is: Tested and Verified

           <?php
            $menuParameters = array(
              'theme_location'  => 'header-menu-top', 
              'container'       => false,
              'echo'            => false,
              'items_wrap'      => '%3$s',
              'depth'           => 0,
            );
            echo strip_tags(wp_nav_menu( $menuParameters ), '<a>' );
            ?>


来源:https://stackoverflow.com/questions/5222140/remove-li-class-id-for-menu-items-and-pages-list

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!