How to Add Class to Link in Wp_Nav_Menu

How to add class to link in wp_nav_menu?

Thanks to Sergiu Paraschiv comment the issue was in regards of limiting to 1.

Therefore it should be in function.php:

function add_menuclass($ulclass) {
   return preg_replace('/<a /', '<a class="list-group-item"', $ulclass);
}
add_filter('wp_nav_menu','add_menuclass');

UPDATE

There is a better way actually which gives us much more control and the piece of code is provided by Jeff Starr on this post

NOTE: this isn't adding the current class tho

Create your menu on wp, then remember to click the location in the menu editor then in your function you'd do:

// custom menu example @ https://digwp.com/2011/11/html-formatting-custom-menus/
function clean_custom_menus() {
    $menu_name = 'nav-primary'; // specify custom menu name
    if (($locations = get_nav_menu_locations()) && isset($locations[$menu_name])) {
        $menu = wp_get_nav_menu_object($locations[$menu_name]);
        $menu_items = wp_get_nav_menu_items($menu->term_id);

        $menu_list = '<nav>' ."\n";
        $menu_list .= "\t\t\t\t". '<ul>' ."\n";
        foreach ((array) $menu_items as $key => $menu_item) {
            $title = $menu_item->title;
            $url = $menu_item->url;
            $menu_list .= "\t\t\t\t\t". '<li><a href="'. $url .'">'. $title .'</a></li>' ."\n";
        }
        $menu_list .= "\t\t\t\t". '</ul>' ."\n";
        $menu_list .= "\t\t\t". '</nav>' ."\n";
    } else {
        // $menu_list = '<!-- no list defined -->';
    }
    echo $menu_list;
}

Finally we can call our menu:

<?php if (function_exists(clean_custom_menus())) clean_custom_menus(); ?>

The code above is taken from the post linked above, I thought to include this answer as it appears this question has many visits.

UPDATE 2

Another solution would be (maybe the best):

header.php:

    <?php
      wp_nav_menu( array(
        'theme_location'  => 'topnav',
        'menu'            =>'topnav',
        'container'       => 'div', 
        'container_class' => 'collapse navbar-collapse', 
        'container_id'    => 'navbarCollapse',
        'menu_class'      => 'menu', 
        'echo'            => true,
        'fallback_cb'     => 'wp_page_menu',
        'items_wrap'      => '<ul class="nav justify-content-end w-100 %2$s">%3$s</ul>',
        'depth'           => 0
      ) );
    ?>

function.php:

 // register the nav
 function register_my_menu() {
  register_nav_menu('topnav',__( 'topnav' ));
 }
 add_action( 'init', 'register_my_menu' );

// let's add "*active*" as a class to the li

add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);
function special_nav_class($classes, $item){
     if( in_array('current-menu-item', $classes) ){
             $classes[] = 'active ';
     }
     return $classes;
}

// let's add our custom class to the actual link tag    

function atg_menu_classes($classes, $item, $args) {
  if($args->theme_location == 'topnav') {
    $classes[] = 'nav-link';
  }
  return $classes;
}
add_filter('nav_menu_css_class', 'atg_menu_classes', 1, 3);

function add_menuclass($ulclass) {
   return preg_replace('/<a /', '<a class="nav-link"', $ulclass);
}
add_filter('wp_nav_menu','add_menuclass');

Wordpress Menu - Add class to anchors

You can do what you need with the WP nav_menu_link_attributes hook:

add_filter( 'nav_menu_link_attributes', function($atts) {
        $atts['class'] = "nav-link";
        return $atts;
}, 100, 1 );

...or if you don't like closures:

function add_link_atts($atts) {
  $atts['class'] = "nav-link";
  return $atts;
}
add_filter( 'nav_menu_link_attributes', 'add_link_atts');

Filter menu list items

To avoid using the WordPress menu UI to add classes to the menu list items, you can take advantage of the 'nav_menu_css_class' filter:

add_filter( 'nav_menu_css_class', function($classes) {
    $classes[] = 'nav-item';
    return $classes;
}, 10, 1 );

How to add class to wp_nav_menu() function

You should try and read the documentation for issues like this as the WordPress documentation is extensive and very good.

https://developer.wordpress.org/reference/functions/wp_nav_menu/

To solve this issue, below 'theme_location' => 'top' add in 'menu_class' => 'menu vertical medium-horizontal expanded medium-text-center'. So your final code will be:

<div class="top-bar" id="main-menu">
        <?php 
            $args = array(
                'theme_location' => 'top',
                 'menu_class' => 'menu vertical medium-horizontal expanded medium-text-center'
            );
        ?>
        <?php wp_nav_menu($args); ?>
    </div>

Wordpress add a class to menu link

You can do it through admin panel also

In Appearance > Menus, click the Screen Options tab
Under Show advanced menu properties, check CSS Classes
Now expand any menu item to reveal the CSS Classes (optional) text

input.
Enter your class name and save your menu to apply the class to the

menu item

http://sevenspark.com/how-to/how-to-add-a-custom-class-to-a-wordpress-menu-item

WordPress - How to add class to top level nav links only

The problem is that the primary-menu is the complete top menu so this can't work for your menu items. Try this instead:

add_filter( 'nav_menu_link_attributes', 'add_class_anchor_nav_primary', 10, 3 );
function add_class_anchor_nav_primary( $atts, $item, $args ) {
    if ( (int) $item->menu_item_parent === 0 ) {
        $class         = 'dropdown submenu';
        $atts['class'] = $class;
    }

    return $atts;
}

This will add your class to all main links excluding the dropdown links. It works because we're checking if the given item has a parent or not. If not (=== 0), we can say, that this is a non-dropdown link. I've tested it and it works.

How to add active class to wp_nav_menu() current menu item (simple way)

Just paste this code into functions.php file:

add_filter('nav_menu_css_class' , 'special_nav_class' , 10 , 2);

function special_nav_class ($classes, $item) {
  if (in_array('current-menu-item', $classes) ){
    $classes[] = 'active ';
  }
  return $classes;
}

How to Add Class to Link in Wp_Nav_Menu