Archived topic
Search Feature as Last Menu Item on Mobile
3 replies · Started by Nick on October 28, 2022
Hey GeneratePressers,
I'm new to GP. Previously I was using Astra and there was an easy function to tick a box and make the search box appear as the last menu item on mobile. So, when the user clicks the hamburger drop-down menu on mobile, it would show all your menu items, then a handy little search box at the bottom of the list.
Currently, on all my sites using GP, the search icon shows up next to the hamburger menu which looks a bit cumbersome on small mobile screens.
I know this isn't a normal feature, but is there an easy workaround without using a plugin or too much extra code/bloat for load speed?
Thank-you for any help!
Hi Nick,
Can you link me to your site so I can see your current header layout?
You can use the private info field for this.
Let me know :)
One of the sites I'm trying to do this on is https://www.intoflyfishing.com/
Thanks
Hi there,
you're site is using the Off Canvas Panel, and in Appearance > Widgets you will see it has it own Widget Area. You can add a Search Block in there.
Then a little CSS to remove the search toggle from the mobile nav:
@media(max-width: 768px) {
.main-navigation .menu-bar-item.search-item {
display: none;
}
}