Cara Membuat Tombol Share di Bawah Postingan Blog - Dengan memasang tombol berbagi ini, akan membawa manfaat bagi blog kita. Semakin banyak artikel yang di share pengunjung ke media jejaring
social, maka semakin banyak pula pengunjung yang datang ke blog kita.
Sebetulnya untuk tamplate asli bawaan dari blogger sudah tersedia, tapi
untuk tamplate hasil download mungkin banyak yang belum menyediakan.
Bagi sobat yang berminat untuk memasangnya, silakan ikuti langkah
- langkah cara memasang tombol share di bawah postingan blog berikut
ini.
Cara Memasang Tombol Berbagi Ke facebook, twitter, google+ di blog
1. Loggin ke blogger dengan akun blog sobat.
2. Klik menu Tata Letak > Edit HTML > Expand Template Widget
3. Copy kode di bawah ini tepat di atas ]]></b:skin>
.fbshare {line-height: 20px; color: #fff !important; background: #3b5998; text-decoration: none !important; border: 1px solid #313c7d; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; border-radius: 2px;}
.twshare {color: #fff !important; background: #4099FF; text-decoration: none !important; border: 1px solid #3a8be8; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.sharebutton {background: #cccccc;border: 1px solid #999;padding: 5px;}
.fbshare {line-height: 20px; color: #fff !important; background: #3b5998; text-decoration: none !important; border: 1px solid #313c7d; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; border-radius: 2px;}
.twshare {color: #fff !important; background: #4099FF; text-decoration: none !important; border: 1px solid #3a8be8; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.sharebutton {background: #cccccc;border: 1px solid #999;padding: 5px;}
4. Copy kode di bawah ini tepat di bawah <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<div class='sharebutton'>
Share This Article To:
<a class='fbshare' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url' rel='nofollow' target='_blank'>Facebook</a>
<a class='twshare' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'>Twitter</a>
<a class='plshare' expr:href='"https://plus.google.com/share?url=" + data:post.url' rel='nofollow' target='_blank'>Google+</a>
</div>
</b:if>
5. Save dan lihat hasilnya
selamat mencoba dan semoga bermanfaat !
<div class='sharebutton'>
Share This Article To:
<a class='fbshare' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url' rel='nofollow' target='_blank'>Facebook</a>
<a class='twshare' expr:href='"http://twitter.com/share?url=" + data:post.url' rel='nofollow' target='_blank'>Twitter</a>
<a class='plshare' expr:href='"https://plus.google.com/share?url=" + data:post.url' rel='nofollow' target='_blank'>Google+</a>
</div>
</b:if>
5. Save dan lihat hasilnya
selamat mencoba dan semoga bermanfaat !
Related Post:
tutorial blog
- PENYEBAB ANJLOKNYA PERINGKAT BLOG
- Contoh Penulisan KODE Background Image
- Daftar widget keren untuk blogger
- Cara mudah Bikin Template Blog Sendiri
- Cara Termudah Membuat Slider Popular Post
- Cara Cepat dan Akurat Memantau Pengunjung Blog/ Website
- Tips Cara Membuat Animasi Semut berjalan di blog
- Cara Mudah Memasang Iklan Melayang di Bawah Footer Blog dengan tombol Close
- Cara Memasang Widget Admin Blog Lagi Online dan Offline
- Cara Mudah Memasang Widget Radio Online Multy Chanel Di Blog/Website
- Cara Memasang Siaran Radio Online di Blog
- Membuat Gambar dan Keterangan di atas Kotak Komentar blog
- Cara Mengetahui Harga Jual Sebuah Blog/Website
- cara mudah membuat judul blog kita berjalan di atas postingan blog
- Cara Mudah dan cepat Pasang TV Online di Blog
- Cara Melaporkan Blog yang Copas tanpa izin Agar di Hapus Google
- Menambah Kolom Diatas dan Dibawah Postingan Blog
- Cara Membuat Tweet Box Dibawah Postingan
- Membuat 3 Kolom di Bawah Header Blogspot
- Cara membuat widget reader di postingan blog
- Cara Memasang Like / Share Button di Setiap Postingan Blogger
- Cara Pasang Widget Lintaskan/Lintas Me di Blog
- Cara membuat link otomatis di blogger