Start with this link to sign up for a Google API Key. Scroll kebawah lalu add blog/web sobat disana dengan menceklis tanda guna agreement ;) nah nanti ada deh kotak paling atas API Key-nya, lalu masukan deh kedalam blogsite.
Thank You for Signing Up for a Google Maps API Key!
Your key is:
ABQIAAAA6Eeb3axyTxk80ElqSOuy2iM5bQjXopWOWqsivw...
Your coded like this<script src='https://www.google.com/jsapi/?key=ABQIAAAA6Eeb3axyTxk80ElqSOuy2iM5bQjXopWOWqsivw...' type='text/javascript'/>Masukan dibawah tag <head> Selamat sobat sudah mempunyai API Key sendiri :-bd Sekarang mari kita masuk ke acara inti mengCustome Google Search biar lebih ekstrim \m/
Tadi selayang pandang bagaimana mendapatkan ApiKey, now get your google custome search. Untuk mendapatakannya sobat harus bikin di halaman Google Custom Search. Klik sana klik sini beres deh. Kalau sudah beres (sdh punya) klik tulisan "manage your existing search engines" ► Click Control panel ► perhatikan sisi sebelah kiri, cari bertulisankan Get Code diklik ► munculah coded-nya :) Default coded
Lihat script<div id="cse" style="width: 100%;">Loading</div>
<script src="//www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1', {language : 'id', style : google.loader.themes.MINIMALIST});
google.setOnLoadCallback(function() {
var customSearchControl = new google.search.CustomSearchControl('XXXXXXXXXXXXXXXXXXXXX:_xxxxxxxxxx');
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
var options = new google.search.DrawOptions();
options.setAutoComplete(true);
customSearchControl.draw('cse', options);
}, true);
</script>
<style type="text/css">
/* here default style CSS */
</style>
<script src="//www.google.com/jsapi" type="text/javascript"></script>Jika didalam template sudah ada itu (script pada awal disuruh buat tadi) tidak usah dipasang lagi. Begitu jg dengan aturan lain yg memang harus menyertakan API Key!!!
Kalau dengan kode default maka hasil generated pencarian akan tampak seperti:
Dengan tambahan sedikit script snippet, maka ekstrim result dihasilkan meliputi blog kita sendiri, Web, News, Blog, Image, Book and Video b-)Full kinerja Script Snippet
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<script src='https://www.google.com/jsapi/?key=ABQIAAAA6Eeb3axyTxk80ElqSOuy2iM5bQjXopWOWqsivw...' type='text/javascript'></script>
<script type='text/javascript'>
google.load("search", "1", {"language" : "id"});
// Call this function when the page has been loaded
function initialize() {
var searchControl = new google.search.SearchControl();
// site restricted web search
var siteSearch = new google.search.WebSearch();
siteSearch.setUserDefinedLabel("YOUR-BLOG-NAME.blogspot.com");
siteSearch.setUserDefinedClassSuffix("siteSearch");
siteSearch.setSiteRestriction("YOUR-BLOG-NAME.blogspot.com");
searchControl.addSearcher(siteSearch);
//Search API Topics
searchControl.addSearcher(new google.search.WebSearch());
searchControl.addSearcher(new google.search.NewsSearch());
searchControl.addSearcher(new google.search.BlogSearch());
searchControl.addSearcher(new google.search.ImageSearch());
searchControl.addSearcher(new google.search.BookSearch());
searchControl.addSearcher(new google.search.VideoSearch());
//others
//searchControl.addSearcher(new google.search.LocalSearch());
//searchControl.addSearcher(new google.search.PatentSearch());
// create a drawOptions object
var drawOptions = new google.search.DrawOptions();
// tell the searcher to draw itself in tabbed mode
drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);
searchControl.draw(document.getElementById("searchcontrol"), drawOptions);
}
google.setOnLoadCallback(initialize);
</script>
<p>Type in a search below!</p>
<div id="searchcontrol"></div>
Perhatikan<script src='https://www.google.com/jsapi/?key=ABQIAAAA6Eeb3axyTxk80ElqSOuy2iM5bQjXopWOWqsivw...' type='text/javascript'></script>
<script type='text/javascript'>
google.load("search", "1", {"language" : "id"});
// Call this function when the page has been loaded
function initialize() {
var searchControl = new google.search.SearchControl();
// site restricted web search
var siteSearch = new google.search.WebSearch();
siteSearch.setUserDefinedLabel("YOUR-BLOG-NAME.blogspot.com");
siteSearch.setUserDefinedClassSuffix("siteSearch");
siteSearch.setSiteRestriction("YOUR-BLOG-NAME.blogspot.com");
searchControl.addSearcher(siteSearch);
//Search API Topics
searchControl.addSearcher(new google.search.WebSearch());
searchControl.addSearcher(new google.search.NewsSearch());
searchControl.addSearcher(new google.search.BlogSearch());
searchControl.addSearcher(new google.search.ImageSearch());
searchControl.addSearcher(new google.search.BookSearch());
searchControl.addSearcher(new google.search.VideoSearch());
//others
//searchControl.addSearcher(new google.search.LocalSearch());
//searchControl.addSearcher(new google.search.PatentSearch());
// create a drawOptions object
var drawOptions = new google.search.DrawOptions();
// tell the searcher to draw itself in tabbed mode
drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);
searchControl.draw(document.getElementById("searchcontrol"), drawOptions);
}
google.setOnLoadCallback(initialize);
</script>
<p>Type in a search below!</p>
<div id="searchcontrol"></div>
Kedua script diatas (berwarna merah) kebanyakan sudah terpasang, maka itu jangan dipasang lagi. Sobat hanya tinggal menanamkan script dibawahnya saja setelah mengganti YOUR-BLOG-NAME.blogspot.com dengan link sendiri. Ingat..ingat..ingat!!! Cermatlah, cermatlah!!!Bloglangdemo
Good luck..
Happy custome search google \m/
Tidak ada komentar:
Posting Komentar