WordPress 3 columns Navigation

Question

I am trying to create 3 columns wordpress navigation so technically:

logo on extreme left Main Menu in the center and two buttons on the extreme right side I have built a markup HTML/CSS using bootstrap but I cant figure out how do I create it on WordPress

my HTML code

<nav class="navbar navbar-default " role="navigation">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <div class="business-logo-align col-md-10" >
            <a href="#">
                <img class="img-responsive " src="logo.png" alt="logo"/>
            </a>
        </div>
    </div>
    <div class="navbar-collapse collapse">
        <ul class="nav navbar-nav navbar-right">
            <li class="col-md-6 col-xs-6 text-center">
                <a href="#">
                    <img src="icon.png" alt=""> Sign In
                    </a>
                </li>
                <li class="col-md-6 col-xs-6 text-center">
                    <a href="#">
                        <button type="button" class="btn btn-danger top-btn">Order now</button>
                    </a>
                </li>
            </ul>
            <div class=" col-xs-9 col-sm-12 col-md-5" >
                <ul class="nav navbar-nav  navbar-centerr">
                    <li>
                        <a href="#" class="busi-btn-active">TV 
                            <span>IPTV</span>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="busi-btn">Our Plans 
                            <span>4</span>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="busi-btn">Support 
                            <span>FAQs</span>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

This is what I have tried on header.php WordPress

<nav class="navbar navbar-default " role="navigation">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <div class="business-logo-align col-md-10" >
            <a href="#">
                <img class="img-responsive " src="logo.png" alt="logo"/>
            </a>
        </div>
        <?php 
                       wp_nav_menu( array(
                            'theme_location' => 'Primary',
                            'container' => 'nav',
                            'container_class' => 'navbar navbar-default',
                            'menu_class' => 'nav navbar-nav navbar-right'

                        ));

                        ?>
    </div>
</nav>

but my main menu (primary is not even working) I tried to change the links on the menu settings but nothing changes it displays all the pages rather than I chose on the menu. I selected Primary checkbox but its not working.

chamzz.dot chamzz.dot · Accepted Answer · 2017-07-29T14:02:11

I think it is better to use the UI designs of the word press. There you can find where to add the header links and you can add linked pages too.I thinks it is easy to follow UI . Also refer the guide of your word press theme.

WordPress 3 columns Navigation

1 Answers