How to add a secondary navigational menu in thesis WordPress theme

  • Login to your WordPress admin panel and move over to thesis section and select custom file editor from the drop down list.

  • Paste this below code in custom_functions.php  ( Remember before editing thesis custom_function.php file take a complete backup of the custom_functions.php file via any FTP client Make sure you insert the code very precisely, else it may crash or lay down your website )

[php]/* Additional navigation menu tutorial by LineToWeb */
/* Links for top menu will need to be manually added here, since this menu isn’t supported by Thesis */
function topnav_menu() {
?>

Change the above link code with your particular links.

  • To style your navigational menu add this code on custom.css

    [php]/* Top Nav bar in custom.css */
    .custom ul#topnav {
    border-style: none;
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    background:#207DAB none repeat scroll 0 0;
    width: 100%;
    float: left;
    }
    .custom ul#topnav li { float: left; padding: 5px 10px 5px 10px; }
    .custom ul#topnav li a { font-size: 1.5em; color: #FFFFFF; }
    .custom ul#topnav li a:hover { color: #FFFFFF;background:#1692C7; }
    [/php]

    This will add a navigational menu to thesis WordPress theme.You can see a screenshot of navigational menu as shown below.

    The particular code is for adding navigation menu above header, if you need navigational menu below header then change this particular line add_action(‘thesis_hook_before_header’, ‘topnav_menu’) to add_action(‘thesis_hook_after_header’, ‘topnav_menu’)

    If you like this tutorial then don’t forget to share it on twitter and facebook.