See It on Your Web Site

While it’s all fun and good to play with the file on your local machine, let’s go ahead and put this on your web site. Better yet, add the search code anywhere on the web that allows you to add html and JavaScript. One good example is a blog such as Blogger (http://www.blogger.com) or WordPress (http://www.wordpress.com).

But first, signup for an API key from Google. Go to http://code.google.com/apis/Ajaxsearch/signup.html, read the terms of use, give them your web site’s URL, and then click the Generate API Key button. A page will appear with the key. We’d recommend that you copy and paste the key in a file somewhere that you can easily find it later. Note that this wasn’t required in the previous examples as you do not need a key to execute the page locally.

Paste the key in a src attribute of the script tag shown below, at end of the URL for the Google Search JavaScript file. It’ll look something like this (note bold):

<script src="http://www.google.com/uds/api?file=uds.js&amp;v=1.0&key=YOUROWNKEY"
 type="text/javascript"></script>

The key value YOUROWNKEY is not a real key; it just shows you where it lives on a page. Go ahead and add it to the sample.html example in the Example 1.

Congrats, now you are ready to upload the HTML that you wrote to the internet, so that the world can your use your search control.

Get Google Ajax Search API now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.