How to put a search box in the header?

Hey,

i would like to place a search bar with the search button in the header but have some problems with the code.
Could you provide me with the css code for both units?

Many thanks!

nikelas

Hello there,

Please check this solution I’ve posted on the WP.org community support channel, which adds a search form in main menu.

If want to put it in the main slide header, checkout this solution.

Regards,
Kharis

Hey,

thank you very much for your help. It works.

Regards,
Nikelas

You’re welcome, Nikelas!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis

Hello Kharis,

How can I change the magnifying glass icon from current white colour to black?

Thanks a lot for your help!

Paul.

Hello Paul,

To color it, you can use this CSS code:


.top-search-menu label:before{
  color: #000;
}

Regards,
Kharis

Thanks a lot Kharis!

It seems so easy when you give the answer :wink:

Have a nice day.

Paul.

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis

Hi Kharis,

I tried first solution you mention here, ut it dosn’t work. I’ve put the jQuery code to a Scripts in footer in Header and Footer Scripts plug in- Options and add correct CSS code, but still nothing. Could You please check what’s wrong? Thats my site

Thank You in advance
Mikolaj

Hello Mikolaj,

Please try disabling site caching plugin temporarily to check if it won’t load new code added.

Regards,
Kharis

You mean Header and Footer Scripts plug in ? Done - disabled

Regards,
Mikolaj

Hello Mikolaj,

Please keep all the custom code remain, then flush cache from WP Super Cache plugin. Run your test. If it still doesn’t load the changes, try temporarily disable the WP Super Cache plugin. Sorry for confusion.

Regards,
Kharis