IntroductionGoogle has launched Ajax API for different purposes “video search” is one of them.Many users’ gets confused all about it many times how to get Google key, how to embed video search in web application. So here I am explaining how to use video search in web application. Getting Google Search API KeyFirst you have to get the Google search API key for this http://code.google.com/apis/ajaxsearch/signup.html Visit here and fill the information and then use of gmail account to get the API key. Note: You can get a gmail account free The key page will look like this. How to use this codeNow copy the whole HTML code, This is the code for “WebSearch”, Video Search and Blog Search but you have to use only the “Video Search” For this the next step. Video SearchIf you listen about Google Code (presented by Google), You have to take the video search control from there.which is like following.Just replace the above code with this, google.load('search', '1');
function OnLoad() {// create a search controlvar searchControl = new google.search.SearchControl();// So the results are expanded by defaultoptions = new google.search.SearcherOptions();
options.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);// Create a video searcher and add it to the controlsearchControl.addSearcher(new google.search.VideoSearch(), options);
Then the whole code will look like this <!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"><head><title>My Google AJAX Search API Application</title><script src="http://www.google.com/jsapi?key=ABQIAAAABE_5tJYjIxZez706qj8fKhSHXJsp5oogWH5jZodYSc2VMsh-GBTebFLwydk8evvTefXYLwNiLYMO_A" type="text/javascript"></script><script language="Javascript" type="text/javascript">//<![CDATA[
google.load('search', '1');
function OnLoad() {
// create a search control
var searchControl = new google.search.SearchControl();
// So the results are expanded by defaultoptions = new google.search.SearcherOptions();
options.setExpandMode(google.search.SearchControl.EXPAND_MODE_OPEN);
// Create a video searcher and add it to the control
searchControl.addSearcher(new google.search.VideoSearch(), options);
// Draw the control onto the page
searchControl.draw(document.getElementById("searchcontrol"));
// Search for a YouTube channel
searchControl.execute("ytchannel:NBA");
}
google.setOnLoadCallback(OnLoad);
//]]></script></head><body><div id="searchcontrol">Loading...</div></body></html> Output Formating the OutputIf you want to format the output then you can use the style tag.Just use this code after closing the </script> tag. <style type="text/css">body{font-family:Arial Rounded MT Bold;background-color:Silver;}#searchcontrol{background-color:ActiveBorder;width:50%;margin-left:auto;margin-right:auto;text-align:left;}<style/> Output Note: In my next upcoming article I’ll examplain the whole search techniquies of GOOGLE. ConclusionWe learned how to get the google Ajax search API key and how to use video search in our web application. Sample Project SourceDownload source files -1 kb |