Integrated the Google Custom Search API in your website
In this article I am going to explain how to Integrated Google Custom Search API in your web site.
Google Custom Search API
Google Custom Search API is a platform provided by Google that allows web developers to feature specialized information in web searches. Users can customize the search engine that is built using Google's core search technology. Once you've defined your search engine, Google provides code for a search box that users can copy and then paste right in to their own Web site.
After login appear a form which is getting info about you’re searching.
a. Sites to Search: - Here I give our website name for searching content.
b. Click to expand Learn More about URL formatting.
c. Language: - Select language.
d. Name: - The name of the CSE will be auto filled based on sites that you enter.
e. Terms of Service: - click on this link for read the terms of service of Google.
f. And in the last click to Create button for creating a script.
After Clicking the Create button now you will get a script.
Now you will copy the script and paste script where which you want to set your Google Custom Search.
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>mindstick</title>
<script>
(function () {
var cx = '008624464961907757347:rf7viccw_rg';
var gcse = document.createElement('script'); gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
</head>
<body>
<div style='width:350px;'><gcse:search></gcse:search></div>
</body>
</html>
Output:-
After type Ajax in textbox and click on search button below screen will be appear.
Ashish Shukla
21-Jan-2016Nice article.
Here is a post how u can Implement google custom search engine in MVC