Google AJAX Search API lets you to create Google search in your own websites with javascript. You can embed a simple, dynamic search and display the search result in your own web pages.
There are three types of searches they are,
- Web Search.
- Local Search.
- Multimedia Search.
Web Search
You can embed web search, blog search and news search into your own website or blogs.
Code
<html>
<head>
<title>Google AJAX Search API Sample</title>
<style type="text/css">
body {
background-color: white;
color: black;
font-family: Arial, sans-serif;
font-size : 13px;
margin: 15px;
}
#searchcontrol .gsc-control { width : 400px; }
</style>
</head>
<body>
<div id="searchcontrol">Loading</div>
</body>
</html>
<script src="http://www.google.com/jsapi" type="text/javascript">
</script>
<script type="text/javascript">
google.load('search', '1.0');
function OnLoad()
{
// Create a search control
var searchControl = new google.search.SearchControl();
// Add in a full set of searchers
var localSearch = new google.search.LocalSearch();
searchControl.addSearcher(localSearch);
searchControl.addSearcher(new google.search.WebSearch());
searchControl.addSearcher(new google.search.BlogSearch());
searchControl.addSearcher(new google.search.NewsSearch());
searchControl.addSearcher(new google.search.BookSearch());
searchControl.addSearcher(new google.search.PatentSearch());
// Set the Local Search center point
localSearch.setCenterPoint("India, IND");
/* tell the searcher to draw itself and tell it where to
attach */
searchControl.draw(document.getElementById("searchcontrol"));
// execute an inital search
searchControl.execute("India");
}
google.setOnLoadCallback(OnLoad, true);
</script>
(Copy & paste in .html file)
Output Screenshot

Web Search
Local Search
If you already have a google Map application and wants to add search capabilities the local search makes you more ease.
Code
<html>
<head>
<title>Local Search</title>
</head>
<body>
<div id="content">Loading....</div>
</body>
</html>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load("maps", "2");
google.load("elements", "1", {packages : ["localsearch"]});
function OnLoad()
{
var content = document.getElementById("content");
/*setting height and width for the div tag where the map
displays*/
content.style.border = "1px solid #979797";
content.style.height = "350px";
content.style.width = "500px";
var map = new google.maps.Map2(content);
map.setCenter(new google.maps.LatLng(9.999958, 78.155365), 11);
var lsc = new google.elements.LocalSearch();
map.addControl(lsc);
}
google.setOnLoadCallback(OnLoad);
</script>
(Copy & paste in .html file)
Output Screenshot

Local Search
Multimedia Search
Multimedia search is as similar as Web search, there we have created a object for the class i.e.
var searchControl = new google.search.SearchControl();
then we added the searches such as,
searchControl.addSearcher(new google.search.WebSearch());
searchControl.addSearcher(new google.search.BlogSearch());
similarly for image and video search, just add the below searchers,
searchControl.addSearcher(new google.search.VideoSearch());
searchControl.addSearcher(new google.search.ImageSearch());
More Examples
Filed under: Google API | Tagged: api, Google API, api key, google ajax search, ajax search | Leave a Comment »