Huft, sudah 2 Hari tidak membuat artikel di sebabkan tidak punya uang untuk ke warnet akhirnya sekarang bisa membuat artikel lagi hehe. Pada kesempatan kali ini saya akan memberikan tutorial tentang bagaimana membuat efek Popular post namun dengan efek 3D ! wah bagaimana yah kira-kira tampilan-nya pasti akan sangat menakjubkan. Langsung saja kamu lihat caranya di bawah ini :
1. Masuk ke akun Blog kamu.
2. Klik Rancangan --> Elemen Laman --> Tambah Gadget --> HTML/Javascript dan kamu salin kode java script di bawah ini.
<style type="text/css">
.cube { width: 200px; height: 200px;}
a img { border: none; }
#linksCube img { width: 100%; height: 100%; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/jqueryimagecube.js"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
$('.popular-posts ul').abupopularcube();
});
</script>
<script type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/popularcube.js"></script>
.cube { width: 200px; height: 200px;}
a img { border: none; }
#linksCube img { width: 100%; height: 100%; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/jqueryimagecube.js"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
$('.popular-posts ul').abupopularcube();
});
</script>
<script type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/popularcube.js"></script>
NOTE :
- Kamu bisa atur berapa lebar dan tinggi dari widget ini dengan mengubah kode yang berwarna biru, width untuk lebar, height untuk tinggi.
3. Simpan Template, Mudah bukan ?
Jika ada komentar tentang artikel ini jangan ragu untuk bertanya, kritik, atau saran yang bisa kamu ketik di kotak komentar, terima kasih untuk abu-farhan.com untuk kodenya :)
Postingan Terkait:
Widget
- Cara Membuat Kotak Fanpage Facebook Hitam Putih
- Cara Membuat Widget Subcription + Social Sharing + Facebook Like Box di Bawah Postingan
- Cara Membuat Lencana Facebook Melayang Untuk Blogger
- Membuat Widget Recent Post Dengan Thumbnail yang Bisa Berputar
- Cara Membuat Widget Popular Post Warna Warni V.2
- Menambahkan Widget Bookmark Otomatis di Blog
- Menambahkan Widget Social Share Melayang Keluar Tiba-Tiba
- Cara Membuat Twitter Box Untuk Blogger
- Membuat Kotak Email Subcription Muncul Tiba-Tiba
- Cara Memasukkan Tanda Tangan Kedalam Setiap Postingan Blog
- Membuat Widget Social Subcription Bergaya Wordpress
- Membuat Widget Artikel Terpopuler Dengan Bermacam Warna
- Cara Membuat 6 Animasi Twitter Melayang Untuk Blogger
- Menambahkan WIdget Sosial Bookmark dari Shareholic
- Menambahkan Widget Sosial Bookmark + Kotak Pencarian Di Blogger
- Cara Menaruh Facebook Like Box Secara Tiba-Tiba
- Cara Memasang Widget Sosial Bookmark Melayang Versi AddThis.com
- Menaruh Kotak Fanpage Facebook di Blogger - V3
- Menaruh Kotak Email Subscription Dengan 3 Warna Berbeda
- Menaruh Widget Sosial Bookmark di Side Bar
- Membuat Scroll Gambar Dengan Plugin jCarousel di Blogger
- Cara Menambahkan Widget Sosial Bookmark Berbentuk Segitiga
- Menambahkan Facebook Recommendations Bar kedalam Blogger
- Menambahkan Widget Icon Sprite Media Sosial di Blog
- Membuat Recent Comments dengan Avatar di Blogger
Blogger
- Cara Menghapus Komentar Spam Secara Otomatis
- Cara Membuat Blog Terindeks Google dengan Cepat
- 5 Kesalahan yang Dilakukan Oleh Blogger Pemula
- Mengembalikan Blog yang Sudah Dihapus, Bisakah ?
- Apa Itu Niche Blogging ?
- Daftar 60+ Forum Do-Follow Ber-PageRank Tinggi 2014
- Cara Menghindari Blog Dihapus Oleh Google
- Cara Memilih Nama Blog & Situs yang Ramah SEO
- Cara Mengembalikan Mood Blogging
- Mengapa Subscriber Feedburner Menjadi 0 ?
- 7 Tips SEO untuk Blogger
- 10 Tips Mantap Untuk Meningkatkan Trafik Organik
- 7 Trik Membuat Artikel Lama Menjadi Populer
- 7 Cara Mendapat Pengunjung Dengan Mudah
- Tutorial Blog dan SEO Terkena Malware ?
- Bagaimana Mengefektifkan Backlink Dalam SEO
- 8 Tips Membuat Loading Blog Lebih Cepat
- Cara Membuat Kotak Fanpage Facebook Hitam Putih
- Optimasi Gambar Untuk Dapatkan Pengunjung
- Cara Menghindari SEO yang Berlebihan
- 8 Tips Untuk Seorang Blogger Pemula
- Cara Mendapatkan Google Sitelink Dengan Cepat
- Cara Membuat dan Tips Pengaturan Meta Tag
- Cara Meningkatkan Ranking Alexa Dengan Cepat
- Cara Mengklaim Situs di Alexa
Popular Post
- Cara Membuat Widget Popular Post Warna Warni V.2
- Cara Membuat Widget Popular Post Warna Warni V.3
- Cara Membuat Widget Popular Post Dengan Bingkai
- Menaruh Widget Subscription Berbentuk Perangko
- Menambah Bar Notifikasi Untuk Blogger Dengan Tombol "Like" Facebook
- Menaruh Pesan di Sticky Bar Dengan Tombol Tutup
- Menambahkan Widget Popular Post dengan Efek Zoom
Good....!!!
ReplyDeletemanteb tenan pokoke, :D
Thanks sob :)
DeleteSori Sob, koq gak nongol widget ya yaaaa...?
ReplyDelete