Thesis Themes Customization: 5 | Add category Nav menu after Header

I will use 1.8 Developer version of Thesis Theme

LogIn to your Dashboard and Go to Thesis > Custom File Editor

 

Select custom_functions.php form drop down menu and Click Edit Selected File.

Place this code below custom_functions.php :

function category_navigation(){

?>

<ul class="catnav">

    <?php wp_list_categories('title_li=') ?> 

</ul>

<?php

}

add_action('thesis_hook_after_header','category_navigation');

 Select custom.css file and place this code below it:

/* Layer of Category navigation */

.catnav {

    border-top: 1px solid #DDDDDD;

    border-bottom: 3px solid #CC0000;

    list-style: none;

    font-size: 13px;

    height: 30px;

    line-height: 30px;

}

 

.catnav li {

    line-height: 30px;

    float: left;

    list-style:none;

}

.catnav li a {

    color: #888888;

    display: block;

    padding: 0 13px;

    font-size: 13px;

    border-right:1px solid #DDDDDD;

}

 

.catnav li a:hover {

    text-decoration: none;

    color: #FFFFFF;

    background: #CC0000;

}

 

.catnav li ul {

    display: none;

}

Use this code for round shape:

/* Layer of Category navigation */

.catnav {

    border-top: 1px solid #DDDDDD;

    border-bottom: 3px solid #CC0000;

    list-style: none;

    font-size: 13px;

    height: 30px;

    line-height: 30px;

}

 

.catnav li {

    line-height: 30px;

    float: left;

    list-style:none;

}

.catnav li a {

    color: #888888;

    display: block;

    padding: 0 13px;

    font-size: 13px;

    border-right:1px solid #DDDDDD;

-moz-border-radius: 3px;

    -khtml-border-radius: 3px;

    -webkit-border-radius: 3px;

    border-radius: 3px;

}

 

.catnav li a:hover {

    text-decoration: none;

    color: #FFFFFF;

    background: #CC0000;

}

 

.catnav li ul {

    display: none;

}

 Now save it.

[Please comment for any Problem]