Search bar in menu

[Kate]

I was wondering if there’s a way to put a full search bar in the menu, not just the icon that expands into the bar. Thanks!

[Tom]

Hi there,

This might help: https://wordpress.org/support/topic/generatepress-search-how-to-change-visual-display

[Lizzy]

Hello,

Can I jump in into this thread please?

As this message is from 5 years ago, is there now an easier way to do this please? With the help of generate blocks for example?

I would like to have a search ‘button’ in my header element, but something bigger then just a magnifying glass.
Is there an easier way to do this nowadays?
thanks
Lizzy

[David]

Hi there,

if you want to use the Navigation search and simply add a label to it and make it look like a button you could add this CSS:

.main-navigation .search-item a:after {
  content: 'Search';
  margin-left: 10px;
}

.main-navigation .search-item a {
  background-color: #f00;
  border-radius: 10px;
  color: #fff;
}

.main-navigation .search-item a:hover {
  background-color: #f10000;
  color: #fff;
}

[Author]

Posts