How do I add a Google Images search to my site?

You seem to be the wizard of unwrapping searches on sites and showing how to add them on our own Web sites, which is awesome. I saw - and really liked - your article on how to add a Google search box to my site but instead of searching Google, I want to search Google Images. Doable?

Dave's Answer:

Sheesh, I feel typecast, like some Hollywood character actor who invariably plays the heavy in the mob crime films or the dorky computer guy or something. :-)

The problem must be that I actually like to unwrap HTML code and figure out how to add neat search boxes to Web sites. I'm sure there's an entry in the DSM IV on the strange, pathological enjoyment of reverse engineering popular Web sites!

Anyway, okay. So. Google Images.

Let's start by cracking the page and seeing what's inside...

No. Let's not. Let's do this differently. This time, let's just look at the URL generated by a search and unwrap that directly. if I search for "banana", here's the URL generated:

http://images.google.com/images?hl=en&q=banana&btnG=Search+Images&gbv=2

Most of that can be axed, as Google includes information on the browser you're running, language you're using, etc., but they aren't critical for the search to succeed.

Trim it down to the bare essentials and it looks like this:

http://images.google.com/images?q=banana&btnG=Search+Images

Actually, a wee bit of testing reveals that the button value (btnG) can be omitted too, which means that in fact the URL is simply:

http://images.google.com/images?q=banana

That's sure nice and simple!

Now, to generate that URL, you need to use a GET form and the input field needs to be named "q" to match the Google specs. This can be easily done thusly:

That's all you need for a basic Google Images search. Here, try it:

Simple enough! Now, I slipped one more thing in, adding target="_blank" as an additional attribute to the "form" tag so that the results would open in a different window. If you don't want that behavior, simply use the code as shown above.

Hope that gets you going with your own personal Google Images search feature.

Categorized: CGI Scripts and Web Site Programming (Article 7970, Written by Dave Taylor)
Tagged: cgi programming, flickr, google images, google search, html programming, photo archives
Previous: What movies have used a particular song in the soundtrack?
Next: What's New in IRS Scams?

Subscribe!

Never miss another Q&A article! Click to subscribe:

Comments

Dave, you're awesome! How could I encrypt the Google Image search so that the results would across even behind a firewall or content filtering tool?

With appreciation,
Miguel Guhlin

Posted by: Miguel Guhlin at March 27, 2008 5:00 PM

Thanks for this insight information!

Posted by: Bobbink at March 29, 2008 8:13 AM

Thanks for the information, really helps alot, but I have a question, is it possible to include a radio button or something so you have the one text box, the one button, and then two radio buttons to select if you want to search images or just the web?

Thanks
Troz

Posted by: Trozza at June 22, 2008 3:23 AM

this site was really useful for me .. thanks a lot..

Posted by: anit at August 16, 2008 8:57 AM

Do you know if I can embed the results of a google image search on my site kind of like how I can embed Flickr image search results on my site?

Posted by: Jared at August 27, 2008 3:17 PM

this is really a great sit, it helped me a lot.
But i have a question how to add our images to google images?

Posted by: nihal at November 5, 2008 11:41 PM

Thanks for the info. I was looking for a way to put the images I have on site to google images search.

Thanks once again

Posted by: steve at November 25, 2008 10:03 AM

i want to add my image in google how can i do this

Posted by: ashwani at January 28, 2009 12:26 AM

i want konw that how we can add our personal image in to google image

Posted by: shiju komath at February 12, 2009 10:57 PM

how do i add my website to google images please

Posted by: morganbellas at June 4, 2009 11:31 AM

Shiju and Morganbellas, you can't explicitly add your site to Google Images, Google just needs to index your pages, find images that are keyword named, and then adds them to the index itself. What I mean by keyword named is that an image called DSC_3737.JPG is going to be far harder to find via Google Image search than if it were named lion-attacking-zebra-african-veldt.jpg would be.

Posted by: Dave Taylor at June 10, 2009 8:33 AM

Hello,

I have my own site indexed about six months but any photo is not in google images... Why? My pics are descripted by alt tags.... etc. What I should to do please help me...

Posted by: sumithranom at June 17, 2009 6:47 AM

Could you show how to create a search box that gives radio buttons to choose between a Google web search or image search?

Posted by: Cyberspy at July 26, 2009 10:32 AM

Hi - I have read some of your technical responses here and I am interested in you taking a peek at my site. I intentionally designed the site to be high in key words and images that are all highly related to vintage collectable art deco figural lamps. I am frustrated because my site is barely showing up on Google and my images are hardly showing up at all on google image searches........? Any suggestions on how I can increase my website rankings and how I can get my images to show up on google image search.....? Any feedback appreciated.

Posted by: Sonny at September 21, 2009 8:56 AM

Cyberspy, I'll try to create one of those but it's a bit tricky because the image search goes to a different URL than the regular Google search. Do a site search for "google image" to see if I've published the new code.

Sonny, the real key to gaining good visibility in Google - or any search engine (I'm thinking "bing" here) - is to have inbound links from external, high quality sites. Instead of worrying about your keyword density, think instead about the existing sites in your market segment and how you can contribute to those sites and thereby gain a few links.

Posted by: Dave Taylor at September 22, 2009 6:00 AM

i want to know how to add our picture in google image list

Posted by: rajneesh jha at October 27, 2009 1:29 AM

i like a google site.....

Posted by: Akhtar khilji at November 7, 2009 12:18 PM

i want to insert images in google image

Posted by: suraj at December 21, 2009 6:43 AM

i want to add google search box in my webnode website. how to add???

Posted by: lavish at February 16, 2010 11:34 PM

HoW Put my pic. in goggle images

Posted by: Ratan at March 12, 2010 6:20 AM

i want to use it for my site photo search, how to use this form as a insite search for photoes supported by google? is there any ways of the code details?thanks a lot!@!@@

Posted by: gaga at November 17, 2010 3:51 AM

i want to know how to add our picture in google image list

Posted by: bikramjit kanrar at March 21, 2011 8:48 AM

Thank you for the detailed article on embedding Google Image search form.

Posted by: Puma S at September 13, 2011 8:37 AM

want konw that how we can add our personal image in to google image...plz help me

Posted by: manoj randhe at September 22, 2011 5:23 AM

your code for adding google image search works fine in "Mozilla Fire fox" , but not in "GOOGLE CHROME".
Can u post the code which works for google chrome browser too.

Posted by: ravi at October 31, 2011 9:37 AM

how can i add a logo on google search

Posted by: nicole cloutier at December 12, 2011 12:34 PM

That is simply cool. It would be an excellent feature if we could display the results in the same page like in a frame.

Posted by: shell at December 14, 2011 10:47 AM

I have something to say, now that you mention it, but ...

I do have a lot to say, and questions of my own for that matter, but first I'd like to say thank you for all your efforts on this Web site by buying you a cup of coffee!

I do have a comment, now that you mention it!