How to add Google’s Image Search to your website?

I know how to add a Google Search Box to my website, but how can I add the Image Search from Google?
Easy!
Let’s take a look at a standard search url from Google:
http://www.google.com/search?source=ig&hl=en&q=rubarber&btnG=Google+search
Now, let’s strip that one down to right the bare essential:
http://www.google.com/search?q=rubarber
The extra info in the string tells Google which website you come from (source=ig -> iGoogle), what language you speak (hl=en), and what the button says (btnG=Google+zoeken)

Now… If you try an image search on Google, and translate to a “bare essentials url” as we did above, we get:
http://images.google.com/images?q=rubarber
So, to get Google’s Image Search result page, with the results that your website’s visitor is looking for, you actually only need one (1) thing in a form: a textfield, with the name ‘q’, which contains the keywords for which your visitor wants to search images.
Putting this all together in nice and clean HTML this results into this:

< form method="get" action="http://images.google.com/images" >
< input type="text" name="q" / >
< input type="submit" value="Search Google Images" / >
< /form >

Or looking like this:


Now, if you don’t want the result page from Google’s images to open instead of your own website, add the optional attribute target=”_NEW” to the form tag, making it

This way, your results will be shown in a brand new browserwindow. Your users will be able to look at the found images, and still continue surfing at your website.
Give it a try!

Leave a Comment





%d bloggers like this: