This question already has an answer here:
I have the following HTML code for menu.
<ul class="navbar-nav ml-auto">
<li class="nav-item mr-3">
<a class="nav-link page-scroll" href="#features">Features <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item mr-3">
<a class="nav-link page-scroll" href="#features">Pricing <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item mr-3">
<a class="nav-link page-scroll" href="#features">Download <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item mr-3">
<a class="nav-link page-scroll" href="#features">Contact <span class="sr-only">(current)</span></a>
</li>
</ul>
Added ul class in the following file. http://my_domain/wp-includes/nav-menu-template.php
<ul id="%1$s" class="navbar-nav ml-auto">%3$s</ul>
How can I add li classes and anchor classes?
</div>
Go to YOURSITEURL/wp-admin/nav-menus.php
open SCREEN OPTIONS make checked "CSS CLASSES" then you will see "CSS Classes (optional)"
field in each menu link.You can add your class in class filed of each menu item.
OR
You can add bellow function for adding class in li element This is how I would do it. Just add something like this to your functions.php file.
function atg_menu_classes($classes, $item, $args) {
if($args->theme_location == 'secondary') {
$classes[] = 'list-inline-item';
}
return $classes;
}
add_filter('nav_menu_css_class','atg_menu_classes',1,3);
If you want class in a tag then add below code in functions.php
function add_link_atts($atts) {
$atts['class'] = "nav-link";
return $atts;
}
add_filter( 'nav_menu_link_attributes', 'add_link_atts');
If you want class in ul element.You can add below code in header area.
wp_nav_menu( array(
'theme_location' => 'top-menu',
'container' => false,
'items_wrap' => '<ul class="nav your_custom_class">%3$s</ul>',
));