Only displaying second level of unordered list links.

benjamin.morgan

benjamin.morgan

New Member
I am building a wordpress site. I have a horizontal navigation with 4 links. Under the commercial page I have 4 sub pages. The client doesn't want it added in as a hover. he wants it on the side of the commercial page. How can I just display the second level of links? In the horizontal nav I have a different div class and on the sidebar i have a different div class. If you could help me out that would be great.
CSS CODE
HTML: 
/* SIDE LEVEL 2 NAVIGATION */
.navigationallink .pagenav ul li { 
        display: none;
}
.navigationallink .pagenav ul li ul  { 
        width: 200px;
        border-radius: 25px;
        float: left;
        margin: 0;
        display: block;
        padding: 0;
        padding-top: 0px;
        list-style: none;
        visibility: visible;
        

}
.navigationallink .pagenav ul li ul li {
        list-style-type: none;
        color: #FFFFFF;
        display:block;
        width: 200px;
        float: left;
                visibility: visible;


}
.navigationallink .pagenav ul li ul li a {
        width: 200px;
        background: url('images/gradback.gif');
        display: inline-block;
        padding: 0px;
        margin: 0px;
        color: yellow;
        font-weight: bold;
        text-align: center;
        text-decoration: none;
        height: 30px;
        line-height: 30px;
}

.navigationallink .pagenav ul li ul li a:hover {
        background: url('images/hoverstate.gif');
}



/* END NAVIGATION */

Here is the source code. The level that shows Burglar Alarm is the only one I want to show in the sidebar. I will add more pages to that level later once i get this done and figured out.


HTML: 
               <div class="navigationallink">

                                        <ul id="sidenav">

                                        <li class="pagenav"><h2 class="displaynone">Pages</h2><ul><li class="page_item page-item-4"><a href="http://localhost/wordpresse/">About Us</a></li>
<li class="page_item page-item-7 current_page_item"><a href="http://localhost/wordpresse/commercial/">Commercial</a>
<ul class='children'>
        <li class="page_item page-item-15"><a href="http://localhost/wordpresse/commercial/burglar-alarm/">Burglar Alarm</a></li>
</ul>
</li>
<li class="page_item page-item-9"><a href="http://localhost/wordpresse/residential/">Residential</a></li>
<li class="page_item page-item-11"><a href="http://localhost/wordpresse/contact-us/">Contact Us</a></li>
</ul></li>                                      </ul>

                                </div>
 
Janja

Janja

New Member
Use the menu's in the appeareance panel. You can create different menus there, then you can add the custom menu for the subpages in a widget in the sidebar ;)
 
You must log in or register to reply here.
Top