<<Back to Article

Google Ajax Search

/skill level/
/viewed/
0 Times

Here is some code you can use to add Google's search functionality to your website. You can add both a standard Google search box that will search the web at large (the first example) or a site-specific search box that will search only pages within a specific URL (the second example). If you want to restrict searches to your own site, use the second example and provide your site's URL as the searchable domain.

You'll need an API key from Google. They are freely available for non-commercial applications.


General Google Search:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<title>My GAjax Search</title>
		<script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key=YOURKEYHERE" type="text/javascript"></script>

		<script language="Javascript" type="text/javascript">
    	//<![CDATA[

    	function OnLoad() {
      	// Create a search control
      	var searchControl = new GSearchControl();

      	// create a search object 
      	searchControl.addSearcher(new GwebSearch());
      	// tell Google where to draw the searchbox
      	searchControl.draw(document.getElementById("search-box"));
      
    	}
    	GSearch.setOnLoadCallback(OnLoad);

    	//]]>
		</script>
	</head>
<body>

		<!-- Search box -->

		<div id="search-box">

		</div>

</body>
</html>


Site Specific Google Search:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<title>My GAjax Site Search</title>
		<script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key=YOURKEYHERE" type="text/javascript"></script>



		<script language="Javascript" type="text/javascript">
    	//<![CDATA[

    	function OnLoad() {
      	// Create a search control
      	var searchControl = new GSearchControl();

     	// create a search object 
      	var siteSearch = new GwebSearch();
	  	siteSearch.setUserDefinedLabel("YourSite");
	  	siteSearch.setUserDefinedClassSuffix("siteSearch");
	  	siteSearch.setSiteRestriction("example.com");
	  	searchControl.addSearcher(siteSearch);
      	// tell Google where to draw the searchbox
      	searchControl.draw(document.getElementById("search-box"));
      
    	}
    	GSearch.setOnLoadCallback(OnLoad);

    	//]]>
		</script>
	</head>
	<body>

		<!-- Search box -->

		<div id="search-box">

		</div>

	</body>
</html>

Introduction

money,GOD,bible,you need to bleave in JESUS.

Code and Explanation

Suggested readings

  • This page was last modified 14:28, 6 November 2008.
Edit this article
Reddit Digg