Laman

Thursday, August 9, 2012

Home » » Membuat Social Bookmarking Animasi Untuk Blogger

Membuat Social Bookmarking Animasi Untuk Blogger

Cara Membuat social bookmarking Animasi Untuk blogger atau pengguna blogspot akan kita bahas pada postingan kali ini.
Dalam posting ini kita memiliki gadget bookmark sosial, tetapi kali ini tidak akan berbentuk hati melainkan telur ovel telur pangsa shape.
penempatan widget seperti ini biasanya di bawah kiri body blog Anda .
Ada Fungsi On yang membuat telur slide terbuka otomatis untuk memperlihatkan tombol bookmark untuk pembaca seperti Facebook, Twitter, Google, Blogger, LinkedIn, Stumble Upon, Email dll.
Berikut ini contoh gambarnya.

dan Untuk DEMO silahkan ke halaman berikut ini :

DEMO Slide

"Lihat di kiri bawah blog,ada telur yang belum pecah..hahaha".

ok kita mulai cara membuat social bookmarking keren di blogspot.
1. Rancangan/desain >> Edit HTML.
cari kode </head>
2. setelah ketemu,pastekan kode di bawah ini tepat di atas atau sebelum kode </head> tadi.

<!-- Kode Awal Social Bookmarking http://thizan.blogspot.com/ --><script src='http://w.sharethis.com/gallery/shareegg/shareegg.js' type='text/javascript'/><script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/><script type='text/javascript'>stLight.options({publisher: &quot;bea50586-2b9f-448d-947a-01385f28e305&quot;, onhover:false}); </script><link href='http://w.sharethis.com/gallery/shareegg/shareegg.css' media='screen' rel='stylesheet' type='text/css'/><!-- Kode Awal Social Bookmarking http://thizan.blogspot.com/ -->

3. Selanjutnya Cari Kode </body>
4. Lalu pastekan kode di bawah ini sebelum atau di atas kode tadi </body>

<!-- Start Heart Share Code From http://thizan.blogspot.com/ --><div style='position: fixed; bottom: 2%; left: 2%;'><div class='shareEgg' id='shareThisShareEgg'/></div><script type='text/javascript'>stlib.shareEgg.createEgg(&#39;shareThisShareEgg&#39;, [&#39;facebook&#39;,&#39;twitter&#39;,&#39;googleplus&#39;,&#39;linkedin&#39;,&#39;blogger&#39;,&#39;stumbleupon&#39;,&#39;sharethis&#39;], {title:&#39; <data:blog.pageTitle/>&#39;,url:&#39;<data:blog.url/>&#39;,theme:&#39;shareegg&#39;});</script><a href="http://thizan.blogspot.com/">Blogger Wordpress Gadgets</a><!-- End Heart Share Code From http://thizan.blogspot.com/ -->

Catatan: Ubah kode warna merah sesuai selera anda , itu untuk posisi widget.
5. Setelah semuanya selesai , silahkan simpan template anda dan lihat hasilnya.
Selamat mencoba dan salam blogging untuk sahabat blogger indonesia.
Beri komentar ya ..

No comments:

Post a Comment

Blogger Wordpress Gadgets