O-OM.COM | Free Blogger Template, Blogger Tutorial dan Belajar Ngeblog

Link to Free Blogger Template, Blogger Tutorial, Belajar Ngeblog

Modifikasi Google CSE Dengan Autofill Keyword Label

Posted: 15 Feb 2011 11:58 PM PST

Elemen terbaru blogspot yaitu element Pages dan element Search Box Google CSE. Jadi kamu bisa buat page di blogspot (max 10 pages) dan menambahkan Search box Google CSE. Saya justru tertarik dengan element CSE-nya, setelah lirik-lirik sebentar kode CSEnya, sepertinya tidak bisa dikustomisasi. Lalu saya coba aja oprek search box CSE pake Google AJAX Search API yang kemudian saya masukkan di blogspot, hasilnya? Coba lihat gambar di bawah ini :

Saya pake Google AJAX Search API yang autofill dengan mengambil keyword label postingan di blog Blogspot dan menempatkannya di single post. Berikut langkah-langkah Modifikasi Google CSE Dengan Autofill Keyword Label di Blogspot :

Dashboard » Layout » Edit HTML » Expand Widget Template
Copy kode berikut :

<script src='http://www.google.com/jsapi'/> <script type='text/javascript'> google.load('search', '1'); function OnLoad() { var customSearchControl = new google.search.CustomSearchControl('ID-CSE-BLOGKAMU'); customSearchControl.draw('content'); customSearchControl.execute('<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'> OR </b:if></b:loop></b:if>');} google.setOnLoadCallback(OnLoad); </script> <div id='content'>Loading...</div>

Paste tepat di bawah kode <b:includable id='comments' var='post'>

Ganti kata ID-CSE-BLOGKAMU dalam kode tersebut dengan unique ID CSE blog kamu. Bikin dulu CSE di Google Custome Search. Nanti kamu dapat kode ID cse seperti ini : Search engine unique ID: 018040453239906698685:ugf5wbo5-j4

Hasilnya seperti ini :

...... <b:includable id='comments' var='post'> <script src='http://www.google.com/jsapi'/> <script type='text/javascript'> google.load('search', '1'); function OnLoad() { var customSearchControl = new google.search.CustomSearchControl('018040453239906698685:ugf5wbo5-j4'); customSearchControl.draw('content'); customSearchControl.execute('<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'> OR </b:if></b:loop></b:if>');} google.setOnLoadCallback(OnLoad); </script> <div id='content'>Loading...</div> <div class='comments' id='comments'> ......

Save pekerjaan kamu dan silahkan lihat hasilnya :)

Kalo kamu mau autofill berdasarkan title postigan blog, kamu tinggal ganti kode :

<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'> OR </b:if></b:loop></b:if>

dengan kode berikut (untuk autofill CSE berdasarkan title postingan) :