NAVIGATION -  HOME |  | |
Customize Google's Free SiteSearch Box | | Published by: admin 2010-03-16 |
| | We have been using Google's Free WebSearch / SiteSearch on our website
for quite some time. The site is currently being redesigned and the
search box is to be more of a bar ( see: http://finditthere.com ). We
can get everything on one line - but the overall form height won't
budge less than 50 pixels. Also, we've replaced the google logo and
search button with slightly smaller versions than what was provided,
but haven't been able to reduce the height of the text field at all.
Hello Dotw-ga ...
There probably is a way to make the box less than 50 pixels in height;
however the link you provided is only 25 pixels high; and without
actually looking at the HTML markup, it is difficult to help or give
you a good answer.
It would help to be able to look at the actual page and coding you are
using, or at least the actual coding.
Thanks ever so,
Serenata
Just want to be clear that what is shown on http://finditthere.com is
an example of what we want the end result to look like. Picture the
blue background twice that height and a larger text field -- and
that's where we are right now.
Hi, Dot W ~
Sometimes making everything fit can be such a struggle, can't it?
Google's Free Web Search gives information on customization here:
://www.google.com/faq_freewebsearch.html#4
Please remember, though, that the height of any table will be
determined by the height of its content, and attempts to limit the
height may cut off a part of the content in some browsers.
Obviously, you need to control the height of the content you want
within a table 25 pixels high - and it is necessary to control the
size of the content. In your case, it is easy, as there is a minimum
amount text (which can be controlled within a form) and the input box,
which can also be controlled by setting a text size within the table.
See: HTML 4 Newbies, HTML Forms Tutorial
- http://www.html4newbies.com/formstutorial.shtml
See: Master CGI, HTML forms tutorial
- http://mastercgi.com/howtoinfo/formtutorial.shtml
See: Net Mechanic, HTML Tip: Controlling Table Size
- http://www.netmechanic.com/news/vol5/html_no15.htm
So, the tweak or hack to keeping the size of your table to the size of
the graphic you submitted (754 pixels wide), which, while not pretty,
works cross-browser and keeps the size of the table and the input
within the table to your 25 pixel height limit. Notice that I did not
limit the table's height to 25 pixels, as doing so actually may make
the table a bit taller in some cases. This is based on the variables
of your viewer's system setting and default size settings within his
browser.
The tweaks listed below is one way to achieve what you want. I used
relative sizing to keep it readable at individual default settings -
and I also reduced the width of the input box to compensate for the
amount of text, plus Google's logo within a single row.
See: http://209.151.82.182/browsertest.html
The tweaks are:
1. The table tag: I changed it to include the width:
2. Within the cell, I added font tags like so:
SEARCH:
3. I reduced the size for the search tag, although I see you have made
a custom search button. The reduction just prior to the search tag is
like so:
4. I added some hard spaces - - to move the ":" over.
You can also divide the single table cell into two; however I ran into
some cross-browser compatibility issues and found working within one
cell worked marvelously.
Search terms:
-- HTML tutorial: controlling table size
-- HTML forms: controlling input sizes
-- html tutorial form input sizes
You can look at the code on the cell above. As I said, it may not be
pretty, but sometimes those HTML tweaks aren't lovely to look while
they do achieve their purpose.
Hope this helps,
Serenata
Thanks,
Serenata
Thanks Serenata. We appreciate your efforts but are going to have to
fall back and approach this from another angle.
Giving you 5 stars anyway...
Hi Serenata,
Please return to http://finditthere.com
If you can do that, then great -- there's a $20 tip in it for you. If
not, please let us know ASAP and we will resubmit.
Thanks,
DOTW
Hi ...
I am unclear as to why you would want to put the table I constructed
for you it inside another table?
There's no reason to put it inside another table, as it would sit
alone
Where, exactly, on which page, do you intend to put it? If you could
put the page in its entirety up for me to look at, I can give you the
coding for that. I need to understand exactly what you are trying to
achieve.
You had asked for it to be 25 inches, which I did ... as a stand alone
... now you wish to put it inside another table and i am not sure the
reason for it. So you will have to help me help you, okay?
Serenata
 Microsoft Unleashes Visual Studio .NET
 IBM's iPhrase Buy Adds to WebSphere
You are looking at:hzrn.com's Customize Google's Free SiteSearch Box, click hzrn.com to home
|
#If you have any other info about this subject , Please add it free.# | |
![]() |
|
|
