admin管理员组文章数量:1418151
Is this possible?
I want to add different classes to the anchors, so not the same on all anchors. How can I do this?
PS: I am using this:
function add_nav_class($output) {
$output= preg_replace('/<a/', '<a class="your-class"', $output, 1);
return $output;
}
add_filter('wp_nav_menu', 'add_nav_class');
But I want to add different classes to the links...
So like this:
<li><a class="1></a></li>
<li><a class="2></a></li>
and so on...
Is this possible?
I want to add different classes to the anchors, so not the same on all anchors. How can I do this?
PS: I am using this:
function add_nav_class($output) {
$output= preg_replace('/<a/', '<a class="your-class"', $output, 1);
return $output;
}
add_filter('wp_nav_menu', 'add_nav_class');
But I want to add different classes to the links...
So like this:
<li><a class="1></a></li>
<li><a class="2></a></li>
and so on...
Share Improve this question edited Jul 29, 2013 at 8:33 Johan asked Jul 28, 2013 at 10:27 JohanJohan 3091 gold badge10 silver badges19 bronze badges3 Answers
Reset to default 2Yes, it is possible.
You can achieve this using wp_nav_menu_objects filter.
function my_wp_nav_menu_objects($objects, $args) {
foreach($objects as $key => $item) {
$objects[$key]->classes[] = 'my-class';
}
return $objects;
}
add_filter('wp_nav_menu_objects', 'my_wp_nav_menu_objects', 10, 2);
The only problem is that these classes will be added to li elements and not to links directly. But it's default WordPress behavior and I don't think you should change it.
If you really have to change it, it is still possible:
function my_walker_nav_menu_start_el($item_output, $item, $depth, $args) {
// you can put your if statements in here (use item, depth and args in conditions)
if ( $depth == 1 ) {
$item_output = preg_replace('/<a /', '<a class="level-1-menu" ', $item_output, 1);
} else if ( $depth == 2 )
$item_output = preg_replace('/<a /', '<a class="level-2-menu" ', $item_output, 1);
}
// .. and so on
return $item_output;
}
add_filter('walker_nav_menu_start_el', 'my_walker_nav_menu_start_el', 10, 4);
you can follow the below Steps :
Step 1 : In the wp-admin, go to Appearance -> Menus,put the class on the menu item here "CSS Classes (optional)". If you can't see the "CSS Classes (optional)" in the menu item, then there is "Screen Option" in the right top of the screen and there are the options "CSS Class" under "Show advanced menu properties".
Step 2: Under your them folder/function.php add below code :
function my_walker_nav_menu_start_el($item_output, $item, $depth, $args) {
$classes = implode(' ', $item->classes);
$item_output = preg_replace('/<a /', '<a class="'.$classes.'"', $item_output, 1);
return $item_output;
}
add_filter('walker_nav_menu_start_el', 'my_walker_nav_menu_start_el', 10, 4);
Hope above code works for you , let me know if still it doesn't work.
function my_walker_nav_menu_start_el($item_output, $item, $depth, $args) {
if (in_array('current-menu-item', $item->classes) ){
$classes['class'] = 'active ';
}
$item_output = preg_replace('/<a /', '<a class="'.$classes['class'].'"', $item_output, 1);
return $item_output;
}
add_filter('walker_nav_menu_start_el', 'my_walker_nav_menu_start_el', 10, 4);
本文标签： Adding different classes to anchor in navigation menu
版权声明：本文标题：Adding different classes to anchor in navigation menu 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745281433a2651444.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论