Lihat ke Halaman Asli

Recent Post Widget for Blogger Using Google API

Diperbarui: 26 Juni 2015   12:23

Kompasiana adalah platform blog. Konten ini menjadi tanggung jawab bloger dan tidak mewakili pandangan redaksi Kompas.

Sahabat kompasiana yang selalu tetap semangat... Kalau pada postingan sebelumnya saya mencoba tips trik dan tutorial tentang bagaimana menambahkan Widget Recent Post untuk Blogger dengan menggunakan Feedburner, dimana demonya saya pakai diblog  Perangkat Guru. Dan kita tahu bahwa  penambahan widget feedburner loadingnya lebih cepat dibanding widget  yang dimiliki blogger. Nah kali ini kita akan belajar  menambahkan Recent Post Widget for Blogger using Google API yang saya dapat dari hacktutors blog. Coba sobat lihat pada demo di bawah, Widget ini terlihat  jauh lebih pintar (lengkap dengan fitur-fitur) dari sebelumnya. Saya kira sobat pasti akan menyukainya setelah melihat demo (Lihat di  bawah) atau bila tidak tampil coba lihat di bawah postingan ini.

Loading...

Pada  Recent Post Widget apa yang Anda lihat di atas, memiliki isi fitur dan gaya penampilan yang berbeda dibanding fast recent post pada postingan terdahulu. Selain itu widget recent post ini banyak memiliki kelebihan dan penambahan fitur2 yang sangat berguna seperti  :

- Menggunakan code Google API - Pada tata letak menampilkan konten - Secara Otomatis  ringkasan singkat postingan di atas bergeser. - Tampak Profesional - Ada efek Hover

Menurut saya ini adalah widget Post Terbaru yang didasarkan pada kode Google API. Nah sobat, bila anda tertarik untuk menambahkan widget ini di blog Anda, cukup ikuti langkah-langkah berikut:

Seperti biasaya anda Log on ke Blogger account  dan pilih Design > Page Element > Add a Gadget > HTML/JavaScript. kemudian tambahkan kode berikut :

<div id="feed-control"> <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span> </div>

<script src="http://www.google.com/jsapi?key=notsupplied-wizard" type="text/javascript"></script>

<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script> <style type="text/css"> @import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css"); </style>

<script type="text/javascript"> function LoadDynamicFeedControl() { var feeds = [ {title: 'JUDUL BLOG ANDA', url: 'http://yourblog.com/rss.xml' }, ]; var options = { stacked : true, horizontal : false, title : "Popular Posts" } new GFdynamicFeedControl(feeds, 'feed-control', options); } google.load('feeds', '1'); google.setOnLoadCallback(LoadDynamicFeedControl); </script> <a href="http://achmadtaher.blogspot.com">Get this Widget</a>

Halaman Selanjutnya


BERI NILAI

Bagaimana reaksi Anda tentang artikel ini?

BERI KOMENTAR

Kirim

Konten Terkait


Video Pilihan

Terpopuler

Nilai Tertinggi

Feature Article

Terbaru

Headline