How do I get my search box to actually work

I’m sure this has been asked before, but I haven’t been able to get any direct answers. I have just completed my new website using bootstrap, and yes it does use static html.

Here are the codes, but of course they are not functioning, because there is something missing. I just don’t know what. Can anyone help? I want it to work within the site, not use google’s external search.

 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#search">
                        <span class="sr-only">Toggle search</span>
                        <i class="fa fa-search"></i>
                    </button>

 <form class="navbar-form" role="search">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Search">
                        <span class="input-group-btn">

			<button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>

		    </span>
                    </div>
                </form>

Thanks!

Hi @fcshops, welcome to the forum!

The code snippet you posted is just a tiny part, could you please post the whole form that you have.

To debug the search we need all relevant coce for the search form. :slight_smile:

1 Like

You’re going to need something other than static HTML for a search facility. You can either program it yourself or find something like Zoom Search Engine which is free for small websites.

3 Likes

Thahks, that was fast. :smiley:

The form lacks the “action” attribute, that sends the query to the actual search engine you prefer.

1 Like

I tried to post the code, but I’m new to this, so not sure how to get it all to show up. Hopefully this works now. Here is the site in case you were wondering: http://www.pioneerheritageshoppe.com/

 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#search">
                        <span class="sr-only">Toggle search</span>
                        <i class="fa fa-search"></i>
                    </button>


div class="navbar-collapse collapse right" id="search-not-mobile">
                    <button type="button" class="btn navbar-btn btn-primary" data-toggle="collapse" data-target="#search">
                        <span class="sr-only">Toggle search</span>
                        <i class="fa fa-search"></i>
                    </button>
                </div>

            </div>

            <div class="collapse clearfix" id="search">

                <form class="navbar-form" role="search">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Search">
                        <span class="input-group-btn">

			<button type="submit" class="btn btn-primary"><i class="fa fa-search"></i></button>

		    </span>
                    </div>
                </form>

            </div>

I think you got a good answer by @Gandalf already, suggesting to implement some cusomizable search you can find.

If you whish to program it yourselt you could send the query to a result page on your site to avoid the user leaves your site.

As aready said, you can’t omit the “acton” attribute. The form you posted will not submit the query anywhere, not even the current page.

IIRC one could put a simple search form to search the site that sends the input query to a suitable search engine of your choice, e.g. www.ixquick.com. This example will replace the current window with the search engine’s result page…

<form action="https://ixquick.com/do/search" method="post">
    <input name="all_terms" placeholder="Find on this site" type="text">
    <input name="with_domain" value="YourSite.com" type="hidden">
    <input value="Search this site" type="submit">
    <div>(Found results links back to this site.)</div>
</form>
2 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.