Moving the Search Bar in the Misty Lake theme?

• 

  howardpublicschool · Member · May 31, 2013 at 1:59 am

  • Copy link
  • Add topic to favorites

  Right now I have the search box as a widget on my sidebar. I am using the Misty Lake theme.

  Is there a way to move it to the top right corner, above the header image?

  I have the custom design upgrade

  The blog I need help with is: (visible only to logged in users)

• 

  justpi · Member · May 31, 2013 at 5:36 am

  • Copy link

  There’s no need to do this via CSS editing: remove the search widget, then go to Appearance > Theme Options, uncheck the option “Yes, I’d like to hide the header search form”, click Save OPtions.

• 

  howardpublicschool · Member · Jun 4, 2013 at 2:34 am

  • Copy link

  Thank you so much for responding justpi.

  I have looked everywhere and I don’t see that check box or option anywhere. For sure is this an option with Misty Lake? Am I missing something?

  TIA

• 

  justpi · Member · Jun 4, 2013 at 7:24 am

  • Copy link

  Sorry, I was thinking of Misty Look…
  Add this:

  #search-2 {
      background: none repeat scroll 0 0 transparent;
      position: absolute;
      right: -19px;
      top: -60px;
      z-index: 111;
  }

• 

  howardpublicschool · Member · Jun 12, 2013 at 2:03 am

  • Copy link

  Thanks again justpi. Much appreciated.

  I copied your code, as is, into the custom CSS area. It does create a search bar at the top, but it’s non-functional. It blinks repeatedly after the page is loaded and it is not possible to put any text into the box.

  Any other suggestions?

• 

  justpi · Member · Jun 12, 2013 at 3:54 am

  • Copy link

  You’re welcome.
  I can see what’s happening: despite the z-index number I added, the widget is actually behind the menu area instead of in front of it. Add this, to limit the width of the menu (assuming you’re not going to add any other top level item):

  .main-navigation {
      width: 79%;
  }

• 

  howardpublicschool · Member · Jun 13, 2013 at 1:01 am

  • Copy link

  Yay! It works!
  Thanks so much for all of your help, it is so appreciated.