Google Custom Search API are wonderful tools to create some awesome search engine like tools. Also if you want to add a search option to your website and customize the look and feel of your search results, Google Custom Search API serve best to you.
Ring in Spring with Stunning Lingerie from Journelle and get $25 OFF purchases of $200 or more! Use promo code: SPRING200. Offer valid 2/22/13-4/30/13. Shop Now
I have created a Real Time Search engine (I call it real time as it search as you type). I am really impressed by the speed/response of Google Search API.
The Code
I will show the code for one of the search api that I implemented in demo page. Let us see how to implement Web Search API.
Step 1: Generate Google Search API Key and Include JavaScript
In order to use Google Search API, you have to first generate a Key for you. Go to following page and signup your self for the Key.
Sign up for Google API Key
Next step is to include the Google Search API javascript. Don’t forget to mention your key in the below code.
<script src="http://www.google.com/jsapi?key=YOURKEY" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1');
</script>
|
Primary
Step 2: Add HTML Container for Web Search
We will create a textbox and a button that will take input for search. And a DIV that will be populated by results:
<input type="text" title="Real Time Search" name="searchbox"/>
<input type="button" id="searchbtn" value="Search" onclick="search(searchbox.value)"/>
<div class="data" id="web-content"></div>
|
When user will write a query and push Search button, a request will be made to Google Search using Custom Search API and the results are fetched. These results are then copied into the DIV.
Step 3: JavaScript to call Google Search API
We will use following JavaScript to call the Google Search API and copy the results in our container DIV.
The code in plain english is:
1. Create an object to connect Google Web search using class google.search.WebSearch.
2. Set a callback function that will get call once the results for the search are fetched.
3. Call the execute() method with search query as argument.
4. In callback function, iterate through the results and copy it to container DIV.
webSearch = new google.search.WebSearch();
webSearch.setSearchCompleteCallback(this, webSearchComplete, [webSearch]);
function webSearchComplete (searcher, searchNum) {
var contentDiv = document.getElementById('web-content');
contentDiv.innerHTML = '';
var results = searcher.results;
var newResultsDiv = document.createElement('div');
newResultsDiv.id = 'web-content';
for (var i = 0; i < results.length; i++) {
var result = results[i];
var resultHTML = '<div>';
resultHTML += '<a href="' + result.unescapedUrl + '" target="_blank"><b>' +
result.titleNoFormatting + '</b></a><br/>' +
result.content +
'<div/>';
newResultsDiv.innerHTML += resultHTML;
}
contentDiv.appendChild(newResultsDiv);
}
function search(query) {
webSearch.execute(query);
}
|
Java Game Development Tutorials will give you a very detailed introduction into the development of online games using Java. We will talk about Java Applets because everyone has a Internet browser, so everyone is able to play these games without installing the JDK! The first 5 chapters will lead you from the basic structure of a applet to the development of a whole (although pretty small) game. The next chapters will give you solutions to problems like AI, level editors, random generation of landscapes… . At the end of every chapter you’ll find a link to download the source-code of the applet we programmed in this chapter and you can take a look at the working applet too.
Google Map API has been a great way to show geographical information on web. A lot of 
Zeeshan Akhter 
You must be logged in to post a comment.