Forum


HomeHomePremiumPremiumSkinningSkinningBanner with search barBanner with search bar
Previous
 
Next
New Post
11/27/2014 5:21 AM
 

I would love to know how you integrated a search bar into your banner. I run a legal search engine site, and this would be a perfect home page addition.

 
New Post
11/27/2014 7:04 AM
 

Hi Allen,

I have custom build that one, but if you know a bit of HTML/CSS and Javascript, it is not that hard. Some pointers:

1 - I'm just using a simple HTML input box with some nice CSS3 formatting like the rounded corners;

2 - Then I captured the click on the magnifier glass with some jQuery and I change the browser URL to the search URL plus the search term - The end result could be something like /Search-Results?Search=TERM - where TERM is the searched keyword.

Here is the jQuery I have used. Unfortunately if you are not a bit familiar with javascript, this will not look that simple:

<script type="text/javascript">
$(function () {

    $("input.form-control").keypress(function (event) {
        if (event.which == 13) {
       event.preventDefault();
if ($("input.form-control").val() != '') {
   window.location.href = '/Search/SearchTerms/' + $("input.form-control").val();
}
        }
    });

    $("em.glyph-search").click(function (event) {
        if ($("input.form-control").val() != '') {
            event.preventDefault();
            window.location.href = '/Search/SearchTerms/' + $("input.form-control").val();
        }
    });

});
</script>

 

 
Previous
 
Next
HomeHomePremiumPremiumSkinningSkinningBanner with search barBanner with search bar



Try FREE
30 days money back guaranteed