尝试将标准的引导程序” nav-link”类添加到由Wordpress菜单呈现的锚点。至今 …
1 /我可以将变量传递给wp_nav_menu()
<?php wp_nav_menu(array(
'theme_location' => 'header-menu', 'menu_class' => 'navbar-nav', 'container' => 'false'
) );
?>
并以这种方式将一个类应用于菜单, 然后删除包含的div。
2 /然后, 我使用Wordpress Appearances> Menu UI将” nav-item”类应用于li标签。
问:如何将一个类应用于wordpress菜单锚的
#1
你可以使用WP nav_menu_link_attributes挂钩执行所需的操作:
add_filter( 'nav_menu_link_attributes', function($atts) {
$atts['class'] = "nav-link";
return $atts;
}, 100, 1 );
…或者如果你不喜欢闭包:
function add_link_atts($atts) {
$atts['class'] = "nav-link";
return $atts;
}
add_filter( 'nav_menu_link_attributes', 'add_link_atts');
筛选菜单列表项
为避免使用WordPress菜单UI将类添加到菜单列表项, 你可以利用” nav_menu_css_class”过滤器:
add_filter( 'nav_menu_css_class', function($classes) {
$classes[] = 'nav-item';
return $classes;
}, 10, 1 );
#2
wp_nav_menu()的参数不允许你使用默认功能将类添加到链接中。它将允许你将<a href=”#”> </a>括在<span class =” wrapped-anchor”> <a href=”#”> </a> </ span>这样的任何html中你用 :
<?php
$parameters = TimothyAURA->set_specific_parameters_you_want(); // i mean, realy fullfill the array with the options you want based on the docs.
$parameters['before'] = '<span class="wrapped-anchor">';
$parameters['after'] = '</span>';
wp_nav_menu($parameters);
如果确实需要为锚设置一个类, 则必须传递一个Walker对象。不过, 你将需要阅读并了解此特定文档。
#3
这使你只能将类添加到”特殊菜单”的锚点。只需将你的类添加到下面的$ menuClassMap值中即可。
function mytheme__menu_anchors_add_css( $atts, $item, $args ) {
$menuClassMap = [
'navbar-menu' => 'my-footer-menu-link-class', 'footer-menu' => 'my-footer-menu-link-class', ];
$additionalClassName = $menuClassMap[$args->menu->slug] ?? '';
if($additionalClassName){
if(!array_key_exists('class', $atts)){
$atts['class'] = '';
}
$classList = explode (' ' , $atts['class']);
$classList[] = $additionalClassName;
$atts['class'] = implode (' ' , $classList);
}
return $atts;
}
add_filter( 'nav_menu_link_attributes', 'mytheme__menu_anchors_add_css', 10, 3 );
评论前必须登录!
注册