Search button

[MarkoKg]

Hey there.

I have a custom styled search bar on my SMF 2.0.6 forum, and I just added a little "search" image next to it (you can see in the picture at the right side of search bar) but now I want that image to be clickable and to start search when clicking on it. Right now search can be started just by hitting enter.

Code for the "image":

Code Select Expand


<A href="#" style="display:block;"><Div class="SubmitSearch"></Div></A>

And if needed, CSS for it:

Code Select Expand


Div.SubmitSearch {
position: absolute;
top: 75px;
left: 50%;
margin-left: 100px;
border-radius: 0px 4px 4px 0px;
cursor: pointer;
width:38px;
padding: 0px 4px 4px 0px;
height: 34px;
background: center center no-repeat url('images/search.png') #53C9F2;
}



I don't know how to link that button to search page, I mean to search results based on users input in that search bar?

[margarett]

You should start by looking at the same bit used by SMF itself in its search (that *has* a search button )

Code Select Expand


<input type="submit" name="submit" value="', $txt['search'], '" class="button_submit" />


How that is made on your theme, well it depends on the theme, that's why we usually recommend to ask the author for advice

[Arantor]

Yup, it's infinitely better to restyle an actual button rather than trying to hammer a div into being one

[SoLoGHoST]

Ouch, a <div> tag inside of an <a> tag?  That goes against everything that I know.  Use a <span> instead and give it a style="display: block;" if you must go that route.

[Arantor]

Ouch, an a tag instead of an input button for form submission?

[MarkoKg]

Indeed.

I just used:

Code Select Expand

<input type="submit" name="submit" value="" class="SubmitSearch" />
and that seems to be working great, lol, don't know why that wasn't came to my mind at the first place

Thanks guys!