Adding class or id to wp_nav_menu using php

  • Hello! I am working on a website where I have had to hack the wp_nav_menu a bit striping out all containers…

    This is all beacause I am applying some jquery effects to the nav that do not like the extra containers.

    What I need help with is adding a class to the link(a tag)of my wp_nav_menu. I’ve been trying to do it with the following php code in the function file, with no success, most likely due to my lack of experience in php:

    // Filtering out some HTML and Code from the Nav
function wp_nav_menu_remove_attributes( $menu ){
	$patterns = array('/ id=\"(.*)\" class=\"(.*)\"/iU', '/<li>/iU');
    return $menu = preg_replace($patterns, '', $menu );
}
function add_menuclass($aclass) {
return preg_replace('/<a>/', '<a id="nav" class="something-classy">', $aclass, 1);
}
add_filter( 'wp_nav_menu', 'wp_nav_menu_remove_attributes', 'add_menuclass' );

    This is the HTML I have:

    <a href="https://www.mywebsite.com/about/">About</a>
<a href="https://www.mywebsites.com/products/">Products</a>
<a href="https://www.mywebsite.com/gallery/">Gallery</a>
<a href="https://www.mywebsite.com/contact/">Contact</a>

    And this is the end result I am looking for…

    <a id="nav" class="something-classy" href="https://www.mywebsite.com/about/">About</a>
<a id="nav" class="something-classy" href="https://www.mywebsites.com/products/">Products</a>
<a id="nav" class="something-classy" href="https://www.mywebsite.com/gallery/">Gallery</a>
<a id="nav" class="something-classy" href="https://www.mywebsite.com/contact/">Contact</a>

    Can someone more experienced pick out what I am doing wrong? Help would be so appreciated… I’ve spent hours trying to figure this out.

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter paesano2000

    (@paesano2000)

    Anyone?

    [please don’t bump]

    Thread Starter paesano2000

    (@paesano2000)

    Well, to not make this forum useless, I thought I’d post solution I used to my problem. Using the preg_replace php function I successfully added a class to the link.

    Add this to your functions.php file to add a class to your link navigation.

    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');

    You can find more information on the preg_replace php function here.

    Paesano,

    I just stumbled on this and found it super useful! I had one question that maybe you could help me with. Is there a way to auto generate a # after each class name. Example:

    <a class="nav1">link</a>
<a class="nav2">link</a>

    etc.

    Wasn’t sure if you knew anyway to dynamically generate this with another PHP command on this tag in the functions.php file.

    Or even a way to pull the page / post id on the anchor tag.

    Anyone? Still not getting anywhere with this.

    I’d like to find a solution to this as well. Currently this function only adds a class to the first nav element.

    Hi,

    The way you do it is by changing the number after $output to the number of times you want the function to happen (-1 for unlimited); so if you want the function to do it for every menu item it looks like 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’);

    hi edmarno

    your function to happen (-1 for unlimited) is really helped me thanks a lot…thanks once again

    Ishak

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Adding class or id to wp_nav_menu using php’ is closed to new replies.