Not sure this is the correct area to post this. I am re-designing a site using Bootstrap and have a search box in the header nav. I only want content on the site to be searchable but am not sure how to go about doing this. It’s there, it looks pretty but it does not work. What do I need to do? I don’t want to use Google search. Any help would be greatly appreciated as this is my first venture into search boxes.
If this isn’t the correct category to post this, please direct me to where I can get the help I need. Thanks.
Is the site just static html?
Hi, cgacfox!
Sorry to be slow responding (distractable is my middle name). Yes, you have posted your question in the right category.
I do not know enough about Bootstrap to give any useful information. Our Bootstrap person is @PaulOB and he is away from home for a few days so his check-ins are infrequent.
Does Bootstrap have its own search engine? I would have thought that it would use the Google engine (or similar) and specify the URI of the site to search in some way.
To answer oddz, yes the site is static html.
Ronpat, I have no idea if Bootstrap has its own search engine.
I am completely new to search boxes so not sure where to begin to get this thing working. I am only working on the index page so far as I am trying to get the look and feel to be the same as the live site but now it will be responsive. That is why I am using Bootstrap.
It does not have its’ own search engine. To do what you want, you will need to start using a backend language like PHP, and code your own search engine, or go off a tutorial online. Do you have a backend language of choice so we can move this thread appropriately?
Search forms work by submitting the form (the HTML can be set up via bootstrap / regular HTML). Then all the processing / search is done by a backend language.
Then the search results page uses that backend language results and then you just output that on the page and style accordingly. You are stuck until you start with a backend language and go from there.
What server-side programming languages does your host provide on your websites production server?
Can you post a URI to your site?
(I think I was reading more into your description of the search field than was intended . )
The current site is attached to my business site for testing proposes. It is http://foxdenwebsolutions.com/newwings/index.html. The page is not perfect, still working on getting everything setup correctly. The hosting is with godaddy.com and PHP would be the language used for the Linux hosting. With all the search boxes on different sites out there, you think it would be easy to find a tutorial or the code to do it but I can’t find anything. I don’t know PHP well enough to do this on my own.
1 Like
<off topic>
I just took a glance at the test site. There are some HTML validation errors at present that are affecting the bootstrap grid. Missing tags, mostly. And I noticed a row within a row, which is against the rules of bootstrap. A row is supposed to be inside a bootstrap “container” or “column” to keep the width of the grid balanced.
https://validator.w3.org/nu/?doc=http%3A%2F%2Ffoxdenwebsolutions.com%2Fnewwings%2Findex.html
I hope you know that one does not need bootstrap to write a perfectly functional responsive web site.
You can start a new topic if you wish/need any help beyond the search box.
Cheers
</off topic>
I appreciate the help as always, ronpat. I wanted to throw something together quickly so I used some online Bootstrap builder. Not really user friendly but better than starting from scratch. I will go through the code and get it cleaned up. There is no rush on this project.
Code cleaned up and no errors.
Ryan, seems this could be a major pain if it is just a static website. Wouldn’t I have to have the search.php page and then a mysql database setup? This seems more trouble than it’s worth. I can see it in WordPress sites because PHP is the language used throughout the site and it already has a mysql database setup. If that is the case, then the search form will be deleted.
I work with another static site that I was asked to do a search feature for…again no rush. Please let me know if I am on the right track in my thinking with the whole search.php and database setup. As I think more about this while type this out, it seems I would have to convert the whole site to PHP.
Hey @cgacfox
The Bootstrap is basically CSS framework, which also include some useful JS stuff, so It doesn’t include any kind of PHP stuff (that you probabbly need).
1 Like
Yes, this is going to be a considerable amount of work if you don’t know PHP. Having said that there are some static search PHP libraries available. The primary one I know about is Sphider. I’m not going to recommend Spyder but it is the one I know about. I’m sure if you search around google for “php static site search script” there will be many others.
This is a more modern version of Sphider and it looks to be still maintained.
If you can get past the shitty website sphider plus looks to be a good solution.
Quickly done. 
I’ll conclude my <off topic> with one last observation. The site triggers a horizontal scrollbar at widths narrower than about 1112px. It is being caused by the fixed width assigned to .hline1.
You can rewrite .hline1 like this:
.hline1 {
width:90%;
height:3px;
background-color:#000;
border:1px solid #bbb;
margin:20px auto;
}
FYI: when using {box-sizing:border-box} (which bootstrap does), the height and width dimensions include padding and borders; therefore, the height of .hline must be at least 1px taller than the sum of border-top and border-bottom for background-color to be visible. In this case, 3px.
</off topic>
Indeed, it’s a huge pain for a static website. I recommend Oddz solution.
Unless I am missing the point a Google Search Box can be easily configured to only search the contents of your site:
.
Whoops, time for another coffee and hopefully it makes me more attentive to detail