0
<ul class="nav navbar-nav" id="hover_slip">
                        <li><a href="index.html">Home</a></li>
                        <li class="arrow_down"><a href="about.html">About Us</a>
                            <div class="sub-menu">
                                <ul>
                                    <li><a href="advisor.html">Advisor</a></li>
                                    <li><a href="single-advisor.html">Single Advisor</a></li>
                                    <li><a href="career.html">Career</a></li>
                                    <li><a href="testimonial.html">Testimonaials</a></li>
                                    <li><a href="partners.html">partners</a></li>
                                </ul>
                            </div>
                        </li>
                        <li class="arrow_down"><a href="service.html">Services</a>
                            <div class="sub-menu">
                                <ul>
                                    <li><a href="service2.html">Service Two</a></li>
                                    <li><a href="pricing-page.html">Pricing Page</a></li>
                                </ul>
                            </div>
                        </li>

  • looks like it's already there. – rudtek Jan 21 at 20:50
0

Sense you want to customize the flow of how menus are built OOTB, I highly recommend studying on up the built in method wp_get_nav_menu_items(). By seeing and manipulating menu lists as seperate objects, you could construct the HTML around the data however you desire to do so.

0

You can use Jquery wrap function to do this. below code will help you to do this.

<ul class="nav navbar-nav" id="hover_slip">
    <li><a href="index.html">Home</a></li>
    <li class="arrow_down"><a href="about.html">About Us</a>
        <ul>
            <li><a href="advisor.html">Advisor</a></li>
            <li><a href="single-advisor.html">Single Advisor</a></li>
            <li><a href="career.html">Career</a></li>
            <li><a href="testimonial.html">Testimonaials</a></li>
            <li><a href="partners.html">partners</a></li>
        </ul>
    </li>
    <li class="arrow_down"><a href="service.html">Services</a>
        <ul>
            <li><a href="service2.html">Service Two</a></li>
            <li><a href="pricing-page.html">Pricing Page</a></li>
        </ul>
    </li>
</ul>   

<script>
    jQuery(function($){
       $('#hover_slip > li > ul').wrap("<div class='sub-menu'></div>");
    });
</script>

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.