Title: Tabbed navigation.
Last modified: August 18, 2016

---

# Tabbed navigation.

 *  [Koray](https://wordpress.org/support/users/koray/)
 * (@koray)
 * [20 years, 3 months ago](https://wordpress.org/support/topic/tabbed-navigation/)
 * So I am porting [http://www.oswd.org/design/preview/id/2614](http://www.oswd.org/design/preview/id/2614)
   that over to WordPress. I have it entirely done aside from one thing, the navigation.
   Specifically the active class.
 * I’d like to have it so I can enable the active class on a tab if it is chosen.
   I just can’t see a way. If anyone has an experience with this or may have some
   ideas, I’d be happy to hear from them.
 * And if I wasn’t descriptive enough, just say. I’m pretty tired.

Viewing 3 replies - 1 through 3 (of 3 total)

 *  [Michael Bishop](https://wordpress.org/support/users/miklb/)
 * (@miklb)
 * [20 years, 3 months ago](https://wordpress.org/support/topic/tabbed-navigation/#post-324441)
 * Are you using the list_pages tag, or hand coding it in?
 *  Thread Starter [Koray](https://wordpress.org/support/users/koray/)
 * (@koray)
 * [20 years, 3 months ago](https://wordpress.org/support/topic/tabbed-navigation/#post-324574)
 * Well I was going to use list_pages but it didn’t seem like it was possible. If
   there is a way to hand code it I’m all ears.
 *  [philiphotserv](https://wordpress.org/support/users/philiphotserv/)
 * (@philiphotserv)
 * [20 years, 3 months ago](https://wordpress.org/support/topic/tabbed-navigation/#post-324602)
 * i have done something similar in my theme:
 * [http://wordpress.hotserv.dk/](http://wordpress.hotserv.dk/)
 * i use this in my header:
    ` <div id="header"> <div id="headerimg"> <h1><a>/">
   <?php bloginfo('name'); ?></a></h1> <div class="description"><?php bloginfo('
   description'); ?></div> </div>
 * <?php //highlight 'Blog' if not Page
    if (is_page()) { $highlight = "page_item";}
   else { $highlight = "page_item current_page_item"; } ?>
 * <div id="supernavcontainer">
    <ul id="supernav"> <li class="<?php echo $highlight;?
   >"><a>">Blog</a>
 * <li><?php wp_list_pages('title_li='); ?></li>
    </div>
 * and the css:
 * `
    #supernavcontainer { position: absolute; top: 174px; left: 50%; width: 500px;
   height: 17px; margin: 0 0 0 -250px; padding: 6px 0 0; }
 * #supernav
    { margin: 0; padding: 0; width: 500px; left: 0; text-align: center;
   color: #777; font: bold 12px Arial, Sans-Serif; letter-spacing: 0.07em; display:
   block; }
 * #supernav li
    { display: inline; margin: 0 5px; padding: 0; text-transform: capitalize;}
 * #supernav a
    { color: white; text-shadow: 0 0 2px black; padding: 5px 5px; }
 * #supernav a:hover
    { background: url(/images/arrow.gif) bottom center no-repeat;
   text-decoration: none; border-bottom: none; }
 * #supernavcontainer ul li a:hover {
    background: url(/images/arrow.gif) bottom
   center no-repeat; }
 * #supernav .current_page_item a {
 *  background: url(/images/arrow.gif) bottom center no-repeat;
    text-decoration:
   none; }
 * hope that helps

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Tabbed navigation.’ is closed to new replies.

 * 3 replies
 * 3 participants
 * Last reply from: [philiphotserv](https://wordpress.org/support/users/philiphotserv/)
 * Last activity: [20 years, 3 months ago](https://wordpress.org/support/topic/tabbed-navigation/#post-324602)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics