Life theme series FAQ and Tips and tricks

From IThemes Codex
Jump to: navigation, search

Contents

How to enable WordPress 3 navigation using a Child Theme

Not possible yet

How to enable WordPress 3 navigation manually

Alternatively, you can apply the changes manually to each file, and follow the steps listed below. Make a backup copy of the theme files that you will be changing, in case the result is not as expected.

modify functions.php

Add the following code to your functions.php, before (!) the closing ?> at the end of the functions.php file.

// register navigation menus if WordPress version supports it
add_action( 'init', 'ithemes_register_menu' );
function ithemes_register_menu() {
	if ( function_exists( 'register_nav_menu' ) ) {
        // Add 3.0+ menu support
        add_theme_support( 'menus' );
        // This theme uses wp_nav_menu() in one location.
		register_nav_menu( 'primary', __( 'Primary Menu' ) );
    }
}

if ( ! function_exists( 'wp_nav_menu' ) ) {
    function wp_nav_menu( $args ) {
            call_user_func( $args['fallback_cb'] );
    }
}

function ithemes_navigation() {
    wp_nav_menu( array('theme_location' => 'primary', 'container' => 'div', 'container_id' => 'menu', 'fallback_cb' => 'ithemes_render_menu'));
 }

function ithemes_render_menu() {
    wp_page_menu(); //takes default arguments from functions.php
}

modify header.php

Replace this code:

	<?php wp_page_menu(); ?>

with the following code:

          <?php ithemes_navigation(); ?>

modify style.css (optional)

The current dropdown menu in Life theme series doesn't allow more than 1 level dropdown navigation. If you do want to have multiple level dropdown, add the following code to the stylesheet. If you do NOT need additional navigation levels, there is no need to add this code.

/* facilitate 3rd level dropdowns */
#menu li:hover ul ul,
#menu li:hover ul ul ul,
#menu li.sfhover ul ul,
#menu li.sfhover ul ul ul {
	left: -999em; 
	margin: -27px 0 0 190px;
}

#menu li:hover ul,
#menu li li:hover ul,
#menu li li li:hover ul,
#menu li.sfhover ul,
#menu li li.sfhover ul,
#menu li li li.sfhover ul {
	left: auto; 
	width: 190px;
}

#menu li:hover,
#menu li.sfhover {
	position: static;
}

Back to the main Life theme series page

Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox