Support » Themes and Templates » Add serchbox to nav in twentyeleven

Viewing 10 replies - 1 through 10 (of 10 total)
  • Do not edit the Twenty Eleven theme. It is the default WordPress 3.2 theme and having access to an unedited version of the theme is vital when dealing with a range of site issues.

    Create a child theme for your customisations, then edit a copy of header.php in your child theme and remove the references to <?php get_search_form(); ?>.

    Thread Starter Mark Shirley

    (@ravalde)

    Thanks esmi,

    sorry forgot to mention that i was going to edit the child theme I had already created. The code I was looking for was to place the search-box into the main navigation. I have found examples of how to do this in twentyten but not twenty eleven.

    Add this into functions.php of the theme:

    <code>
    function fb_add_search_box ( $items, $args ) {
    	// only on primary menu
    	if( 'primary' === $args -> theme_location )
    		$items .= '<li class="menu-item menu-item-search">' . get_search_form( FALSE ) . '</li>';
    	return $items;
    }
    add_filter( 'wp_nav_menu_items', 'fb_add_search_box', 10, 2 );
    </code>

    Check this article out, too: http://wpengineer.com/2244/search-form-in-wp-nav-menu/

    Thread Starter Mark Shirley

    (@ravalde)

    Thanks hkalant

    This was one of the first solutions I found but just cant get it to work in twentyeleven child theme just crashes my functions.php file and I have to go into the file directly and take it out to restore the site

    try and use the snippet without the <code> bits; i.e. try:

    function fb_add_search_box ( $items, $args ) {
         // only on primary menu
        if( 'primary' === $args -> theme_location )
             $items .= '<li class="menu-item menu-item-search">' . get_search_form( FALSE ) . '';
         return $items; }
    add_filter( 'wp_nav_menu_items', 'fb_add_search_box', 10, 2 );
    Thread Starter Mark Shirley

    (@ravalde)

    Wow – thanks for all the help but I’ve also tried that as well
    this is what I have in my child themes function.php file below
    for adjusting my header size.
    I’ve tried the code inside and outside the <?php….?>

    <?php
    define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyeleven_header_image_width', 1000 ) );
    define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyeleven_header_image_height', 100 ) );
    ?>

    [Please post code snippets between backticks or use the code button.]

    @ravalde
    the function from http://wpengineer.com/2244/search-form-in-wp-nav-menu/ seems to assume that you are using the custom menu; it does not seem to work with the default fallback wp_page_menu().

    why did you remove the search form in the first place?

    Thread Starter Mark Shirley

    (@ravalde)

    alchymyth

    I didnt remove the searchbox, I just want move it into the navigation bar

    ideally, you could post a link to your site; that makes helping with formatting/css issues easier.

    the searchform position is defined in style.css, for different situations:

    /* Search Form */
    #branding #searchform {
    	position: absolute;
    	top: 3.8em;
    	right: 7.6%;
    	text-align: right;
    }

    and

    #branding .only-search #searchform {
    	top: 5px;
    	z-index: 1;
    }

    and

    #branding .with-image #searchform {
    	top: auto;
    	bottom: -27px;
    	max-width: 195px;
    }

    you have to redefine this in style.css of your child theme;
    example (adapt the numbers for your needs):

    #branding #searchform {
      position: absolute;
      top: auto;
      bottom: -30px;
    }

    (you might need to redefine somthing for the other situations as well – no idea where they are called)

    Thread Starter Mark Shirley

    (@ravalde)

    Cant get that to work either I probably need to learn how to create a widget area in the header. I’m working on wide pages so there is no widget available. I’ll have to figure out how to create a widget area in the branding or navigation I’ll post back if I have any success – thanks

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Add serchbox to nav in twentyeleven’ is closed to new replies.