I am learning wordpress by my own and this is the code of html template.

    <div class="collapse navbar-collapse" id="ftco-nav">
        <ul class="navbar-nav ml-auto">
            <li class="nav-item active"><a href="index.html" class="nav-link">Home</a></li>
            <li class="nav-item"><a href="about.html" class="nav-link">Who we are</a></li>
            <li class="nav-item"><a href="causes.html" class="nav-link">Causes</a></li>
            <li class="nav-item"><a href="blog.html" class="nav-link">Stories</a></li>
            <li class="nav-item"><a href="contact.html" class="nav-link">Contact</a></li>

I want to convert it into wordpress. I converted it into wordpress by adding this code:-

<?php wp_nav_menu(array( 'menu' => 'primary', 'container' => 'div', 'container_class' => 'collapse navbar-collapse', 'container_id' => 'ftco-nav', 'menu_class' => 'navbar-nav ml-auto', 'menu_id' => '', ));?>

but the problem is that how will I apply active class to it? please someone help me in this.


Change your active class name in your css. WordPress adds the following active classes, depending on the context of the active state:

current-menu-item, current-menu-ancestor, current-menu-parent, and current-page-ancestor


May be this can helps you. add in functions.php

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

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.