PDA

View Full Version : Working with Google Custom Search Engine - please help!


laguy03
01-19-2009, 11:00 PM
So I'm trying to add a Custom Google Search Engine to a site that I'm working on, but I'm having some trouble.

When I'm inserting the code into Dreamweaver, the search engine looks differently then the preview on the Google site showed me. I was working from a template, but there was a search box where I'm now putting the Google CSE. I've attached a before and after picture. As you can see in the after picture (with the Google SE) the search button ends up below the input box. How can I fix this problem. And is there any other way to format how long that input bar is?

Here is the code I have in Dreamweaver:

<td width="100%" bgcolor="#0229A7" style="padding:31px 0px 0px 25px;">
<style type="text/css">
@import url(http://www.google.com/cse/api/branding.css);
</style>
<div class="cse-branding-bottom" style="background-color:#0229A7;color:#000000">
<div class="cse-branding-form">
<form action="http://www.google.com/cse" id="cse-search-box">
<div>
<input type="hidden" name="cx" value="XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" size="31" />
<input type="submit" name="sa" value="Search" />
</div>
</form>
</div>
<div class="cse-branding-logo">
<img src="http://www.google.com/images/poweredby_transparent/poweredby_999999.gif" alt="Google" />
</div>
<div class="cse-branding-text">
Custom Search
</div>
</div>
</td>

Ricky55
01-20-2009, 04:31 AM
The one on the left is using a custom submit button and its also not pointing to the standard Google logo.

You need to write in Site Search like this


<span>Site Search:</span>
<input type="text" name="q" size="31" />


Then you need to remove the lines
<div class="cse-branding-logo">
<img src="http://www.google.com/images/poweredby_transparent/poweredby_999999.gif" alt="Google" />
</div>

and create a style for the submit button

laguy03
01-20-2009, 06:08 AM
Thanks. Actually, the one on the left was from a template so it isn't really functional.

I posted the pic because that is how I want the Google one (pic on the right) to look. How do I create a style for the submit button?

And how do I get the input field and the submit button on the same line?

Ricky55
01-20-2009, 08:41 PM
You could just use this code

<!-- Google Search Box START -->
<iframe src="http://www.getgooglesearch.com/htmlcodes/search.html"
name="googlesearch" allowtransparency="true" scrolling="no"
frameborder="no" height = "45px" width = "400px"></iframe>
<!-- Google Search Box END -->

laguy03
01-20-2009, 09:13 PM
You could just use this code

<!-- Google Search Box START -->
<iframe src="http://www.getgooglesearch.com/htmlcodes/search.html"
name="googlesearch" allowtransparency="true" scrolling="no"
frameborder="no" height = "45px" width = "400px"></iframe>
<!-- Google Search Box END -->

But that would give me a regular Google search engine, not a custom one, correct?

Ricky55
01-21-2009, 05:13 PM
where did you get your original code? Yours looks strange, let me know and then I'll have a go at editing it for you.