Home > DeveloperSection > Articles > Integrated the Google Custom Search API in your website

Integrated the Google Custom Search API in your website


API(s) API(s) 
Ratings:
1 Comment(s)
 4094  View(s)
Rate this:

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.

For integrated Google Custom Search API you need to login with a Gmail id on this link:

https://accounts.google.com/ServiceLogin?continue=http://www.google.com/cse/manage/create&service=cprose&hl=en&gl=us&passive=true

Integrated the Google Custom Search API in your website

After login appear a form which is getting info about you’re searching.

Integrated the Google Custom Search API in your website

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.

Integrated the Google Custom Search API in your website

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:-

Integrated the Google Custom Search API in your website

After type Ajax in textbox and click on search button below screen will be appear.

Integrated the Google Custom Search API in your website

 

 


Google custom search engine

By Ashish Shukla on   10 months ago
Nice article. 
Here is a post how u can Implement google custom search engine in MVC  

Don't want to miss updates? Please click the below button!

Follow MindStick