Cara Membuat dan Memasang Tombol Share Dibawah Postingan Blog

Cara Membuat Tombol Share Dibawah Postingan Blog – Pada artikel sebelumnya saya pernah menulis Cara Membuat Memasang Tombol Share di Samping Blog, pada kesempatan kali ini saya akan memberikan Panduan Cara Membuat Tombol Share Dibawah Postingan Blog.

Pada artikel Cara Membuat Memasang Tombol Share Di Samping Blog sebelumnya saya sudah menjelaskan secara rinci apa saja manfaat Memasang Tombol Share di Blog sobat, banyak sekali manfaatnya dari memasang tombol share, perlu sobat ketahui memasang tombol share itu penting sekali jika artikel sobat bermanfaat bagi pembaca maka pengunjung tidak akan sungkan memberikan like dan membagikan artikel sobat kepada orang lain sehingga blog sobat akan dikenal oleh orang banyak.

Keuntungan lain juga bisa sobat dapatkan dari membuat tombol share tersebut baik itu Membuat Tombol Share di Samping blog, Membuat Tombol Share Melayang di Blog, atau Membuat Tombol Share di Bawah Postingan Blog. Apa saja Keuntungannya?

Ada 5 Keuntungannya

• Blog Terlihat Profesional
• Blog Menjadi Terkenal
• Pageview Blog Meningkat
• Artikel Blog Mudah Di Like Pengunjung Dinilai Relevan
• Artikel Blog Mudah Dibagikan Pengunjung Dinilai Bermanfaat

Baca Juga : Cara Membuat Memasang Tombol Share di Samping Blog
Baca Juga : Cara Menambahkan Tag Hreflang Untuk Blog SEO

Setelah sobat mengetahui keuntungannya kini dari ketiga Tombol Share yang saya sebut diatas tadi mana yang memiliki fungsi dan manfaat yang baik untuk blog kita? sebenarnya tidak ada perbedaan dari masing-masing Tombol Share yang sebut tadi semuanya memiliki fungsi dan manfaat yang sama yakni agar ketika pengunjung membaca artikel sobat secara keseluruhan dan pengunjung menilai artikel sobat bermanfaat maka pengunjung tdak akan sungkan membagikan artikel sobat ke media sosial mereka baik itu facebook, twitter, Google+, Instagram dan media sosial yang lainnya.

Jadi sesuai dengan judul artikel Cara Membuat Tombol Share Dibawah Postingan Blog ini saya akan coba memberikan arahan agar sobat bisa mengikuti dengan mudah, oke langsung saja kita mulai.

Cara Membuat Tombol Share Dibawah Postingan Blog

1.Login ke akun Blogger sobat, Pilih Tema, Edit HTML.

2.Cari Kode <data:post.body/> agar lebih cepat gunakaan kombinasi ctrl+f.

3.Terdapat beberapa kode <data:post.body/> yang sama di dalam tempalte sobat karena beda template beda penempatan, sobat pilih saja kode yang kedua.

4.Masukkan kode script dibawah ini setelah kode yang kedua.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='tombol-berbagi'>
<div class='tombol-berbagi-fb'>
<a class='tombol-berbagi-fb' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'/><a class='tombol-berbagi-fb-label' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'> Share on Facebook</a></div>
<div class='tombol-berbagi-tw'>
<a class='tombol-berbagi-tw' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow' target='_blank'/>
<a class='tombol-berbagi-tw-label' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow' target='_blank'>Share on Twitter</a></div>
<div class='tombol-berbagi'>
<a class='tombol-berbagi-gp' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'/>
<a class='tombol-berbagi-gp-label' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Share on Google+</a></div>
<div class='tombol-berbagi'>
<a class='tombol-berbagi-lin' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' rel='nofollow' target='_blank'/>
<a class='tombol-berbagi-lin-label' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' rel='nofollow' target='_blank'>Share on LinkedIn</a>
</div>
</div>
</b:if>

5.Selanjutnya Cari Kode <style/>
6.Masukkan script di bawah ini sebelum kode tadi.

/* CSS Share Button */
.tombol-berbagi{display:block;position:relative;height:43px;line-height:43px;padding:10px;border-top:1px solid #dadada;border-bottom:1px solid #dadada;margin:auto}
.tombol-berbagi-fb,.tombol-berbagi{float:left;width:21%;padding:0 10px;height:inherit}
.tombol-berbagi-tw,.tombol-berbagi,.tombol-berbagi-lk{float:left;width:21%;height:inherit;padding:0 10px;border-left:solid 1px #dadada}
.tombol-berbagi-fb,.tombol-berbagi-tw,.tombol-berbagi-gp,.tombol-berbagi-lin,.tombol-berbagi-pi{float:left;display:block;background:url('http://2.bp.blogspot.com/-FYy1a99SDXE/VXuCSz_hYjI/AAAAAAAACbg/8dz4LkDIHYY/s1600/share.png') no-repeat;width:42px;height:41px;margin-right:3px}
.tombol-berbagi-fb-label{color:#2d609b}
.tombol-berbagi-fb-label,.tombol-berbagi-tw-label,.tombol-berbagi-gp-label,.tombol-berbagi-lin-label{float:left;width:58px;height:inherit;font-size:12px;font-family:'Open Sans Bold',Arial,sans-serif;line-height:14px;margin:5px 0 0 4px}
.tombol-berbagi-tw{background-position:0 -43px}
.tombol-berbagi-tw-label{color:#00c3f3}
.tombol-berbagi-gp{background-position:0 -86px}
.tombol-berbagi-gp-label{color:#f00}
.tombol-berbagi-lin{background-position:0 -129px}
.tombol-berbagi-a{color:#999;transition:all .3s;}
.tombol-berbagi-a:hover{color:#7cb0ed}
@media only screen and (max-width:640px){
.tombol-berbagi,.tombol-berbagi-fb{display:inline-block;float:none;width:48%;padding:0;height:inherit}
.tombol-berbagi,.tombol-berbagi-tw,.tombol-berbagi-lk{float:left;width:48%;padding:0;border-left:0}}

Save template.

Demikian Panduan Cara Membuat & Memasang Tombol Share DiBawah Potingan Blog, jika sobat mengalami kendala, tinggalkan komentar sobat. Happy Blogging;s.

Share this post

Berlangganan update artikel terbaru via email: