Support » Themes and Templates » Add serchbox to nav in twentyeleven
Add serchbox to nav in twentyeleven
-
Hi
Does anybody know how to move the searchbox to the main navigation in twentyeleven.
-
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(); ?>
.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/
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 );
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 fallbackwp_page_menu()
.why did you remove the search form in the first place?
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)
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
- The topic ‘Add serchbox to nav in twentyeleven’ is closed to new replies.