My best option for search bar?

Ask the community
, ,
1

Hey guys, I’m making a website for a liquor store, and we’re listing products on there under tabs (ie click liquor, dropdown menu organizes by gin, vodka, etc) and when you click that, it goes to a specific page of the products we have there.

Now, I used originally a list/grid (the cat template) and went from there, as it could display large images, but found out today about the database option, and started implementing that. The owners aren’t satisfied entirely with the database because the pictures can only be so big (I adjusted row height to max, still small) but I showed them aside from that, it’s better than the list/grid because that thing is lag heaven and does not display correctly on mobile; it looks like trash.

Either way, they want a search engine on the header that will bring up items wherever they are. For example, if I would type in captain morgan, they would want a list to come up in the middle of the page of all the captain morgan products. I know if I had the search engine on top of the “rum” page right before the list started and used the database display, it would work that way. However, they want it on any page to pop up. I have no idea how to do that without having a blank ugly list on the main page before anything else, and I don’t think you could do that. Could you?

Does the search bar even work with the list/grid display? Honestly, I know in this case, making a store makes the most sense, but given the legality of a liquor store and uploading to e-commerce, etc etc… it really isn’t very easy, it’s actually insanely difficult and we can always move down that road later.

What do you guys think is my best option here? Can I make a search bar in the header and always display results on any page? Will a search bar run with a list/grid and not database? IS THERE A FASTER WAY TO PUT INFORMATION IN THE LIST/GRID AND NOT BE LAG HEAVEN AND/OR WORK ON MOBILE!?!?

These are the questions that keep me up at night. Thank you guys, I appreciate it.

2

I forgot to put this here… I know there’s a free store widget that you can’t accept orders in, that’s fine, and right now, fits what I’m going for. Throwing that into the equation, could it be possible to throw the search bar on the header and have it search for products?

3

Hello Sean,

I am here to help you sleep at night. :joy:

For your search feature I suggest following this guide .
Hooking it up to your products collection should not be a problem, just change the query to . query(‘Store/Products’) , or however your products are structured.

I have no idea how to do that without having a blank ugly list on the main page before anything else, and I don’t think you could do that. Could you?
Yes this is possible, just let the default value be all products, so you avoid the blank ugly list.

What do you guys think is my best option here? Can I make a search bar in the header and always display results on any page? Will a search bar run with a list/grid and not database?

You’re best option is to use the search feature found above and put it on specific pages that you want, only if it is imperative, keep it in the header as it is a big resource to have on all pages. The search bar will query the actual database and update the list/grid based off the filter result options.

Try it out, and if you run into any trouble let us know, we will help you debug it!
Best,
Majd