Theme: Twenty Twelve, add search bar

Ahh. No, I don’t. I made the child theme, it only has one file, style.css.

I copied all the stuff from the main theme style.css (to keep my fonts/colors/heading styles) into child and updated the main theme.

When I moved over to the child theme, the search bar disappeared. Let me poke around some old files I have and see if I can find anything that says search in it.

Nothing in the old header.php file.

Okay, I’d guess it’s a modified header.php file – in which case you can put that version of the file in your child theme.

In the event I can’t find it, this takes me back to the original intent of the post (ha!).

What would I need to add/edit/alter to put a search bar?

Okay, so make a copy of your header.php file and put it in the child theme – then find this line of code:

</hgroup>

and right below that add this:

<div id="nav-search">
<?php get_search_form(); ?>
</div>

Then the above CSS you added should put it to the right side of your nav – though it might need a bit more adjusting in the CSS.

Excellent! Almost there! Just trying to figure out how to bring it down.

If anyone has any suggestions on how to tweak the CSS, I’d be indebted!

Hi again,
Sorry I didn’t see this until just now – try adding this to your CSS:

.main-navigation {
    margin-top: -9px;
}

No worries! All the help you’ve given me has been much appreciated.

No dice on the code, though. That search bar looks like it firmly exists on the upper-most part of the header. Still scratching my head on what code needs to happen to get it where the menu is.

For the record, this is the code active right now:

#nav-search {
float:right;
margin-top:0px;
}

.main-navigation {
    margin-top: -9px;
}

I don’t see that on your site – did you save it and clear any caching?

You don’t see the code or don’t see the search bar?

I don’t see this CSS:

.main-navigation {
    margin-top: -9px;
}

Looks like you have W3TC – so make sure you’ve cleared that.

Oops, now it does seem to be working – maybe my cache :)!

Hee hee. My personal cache has been cleared, as has my plugin cache.

Search bar is still hanging out above the menu titles on my screen.

Looks perfect to me in Firefox, but not Chrome :(. See if putting that code in a media query changes anything:

@media screen and (min-width: 600px) {

.main-navigation {
    margin-top: -9px;
}
}