Cara Memasang Tombol Share Sosial Media di Postingan Blog

Cara Memasang Tombol Share Sosial Media di Postingan Blog
Cara Memasang Tombol Share Sosial Media di Postingan Blog
Selamat Datang Di IMAMKUNBLOG - Sudah beberapa hari ini saya tidak ngepost disini, dan sekarang saya ingin berbagi lagi Tutrorial Blogger Mengenai Cara Memasang Tombol Share Sosial Media di Postingan Blog.

Untuk Sobat-sobat yang sering berkunjung disuatu website pasti pernah melihat tombol share artikel ke sosial media seperti, Facebook, Twitter, Google Plus dan masih banyak lagi. Mengepa harus dipasang Tombol Share Sosial Media? Menurut Saya pengunjung yang datang di blog sobat dapat membagikan artikel-artikel yang sobat dan yang dimana para visitor menganggap artikel sobat itu sangat bermanfaat atau menarik.

Jadi Apa keuntungan dengan memasang Tombol Share sosial media ini? Menurut saya dengan adanya tombol share sosial media ini yang dimana jika visitor membagikan artikel sobat ke sosial medianya maka akan menambah jumblah visitor blog sobat dan pastinya blog sobat bisa ramai dan tidak sepi.

Untuk penjelasannya sampai disitu saja ya! Sekarang kita masuk ke tutroial pemasangannya. Dan untuk pemasangannya tidak susah ya sobat. Sangat mudah kok masangnya. Agar tidak pusing usahakan baca sampai habis ya.

Cara Memasang Tombol Share Sosial Media di Blogger

1. Log ini Ke Blogger > Pada Dasabor Blogger Sobat Pilih Tamplate (Theme)
2. Kemudian Klik Edit HTML


3. Cari Kode ]]></b:skin> dan Letakkan Kode CSS Dibawah ini sebelum Kode ]]></b:skin>
agar lebih mudah mencari kodenya Gunakan CRTL + F

Cara Memasang Tombol Share Sosial Media di Postingan Blog

.share__button {
width: 100%;
overflow: hidden;
margin-top: 20px;
}
.share__button a {
display: block;
height: 32px;
line-height: 32px;
color: #fff;
float: left;
padding-right: 10px;
margin-right: 10px;
margin-bottom: 25px;
}
.share__button .facebook {
background-color: #436FC9;
}
.share__button .twitter {
background-color: #40BEF4;
}
.share__button .google {
background-color: #EC5F4A;
}
.share__button span {
display: block;
width: 32px;
height: 32px;
float: left;
margin-right: 10px;
background: url(https://lh6.googleusercontent.com/-_xmVrHoLpCo/VNBsLm2TQSI/AAAAAAAAAZg/5SbdJpV7gN4/s800/single-share.png) no-repeat;
}
.share__button .facebook span {
background-color: #3967C6;
}
.share__button .twitter span {
background-color: #26B5F2;
background-position: -72px 0;
}
.share__button .google span {
background-color: #E94D36;
background-position: -144px 0;
}

4. Jika sudah dipasang CSS Diatas skrang Memasang Script Pemanggilnya

Cari Kode <data:post.body/>  didalam Tamplate edit HTML. Biasanya Kode tersebut ada 2 atau 4 Kode yang sama. Simpan Script Pemanggilnya di <data:post.body/> yang pertama.
dam letakkan kodenya dibawah kode tersebut atau diatas kode <div class='post-footer'>
seperti gmbar dibawah ini.

Cara Memasang Tombol Share Sosial Media di Postingan Blog

<b:if cond='data:blog.pageType == &quot;item&quot;'><div class='share__button'><a class="facebook" expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' target="_blank" title="Facebook"><span></span>Facebook</a><a class="twitter" expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' target="_blank" title="Twitter"><span></span>Twitter</a><a class="google" expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.canonicalUrl' onclick="javascript:window.open(this.href, &quot;&quot;, &quot;menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600&quot;);return false;" rel="nofollow" title="Google+"><span></span>Google Plus</a></div></b:if>
5. Save Template Sobat

Nah mudah bukan mmebuatnya Sekian untuk Tutorial Cara Memasang Tombol Share Sosial media di blogger. Semoga Artikel ini bermanfaat buat kalian dan jika masih ada yang bingung kalian bisa komentar dibawah. nanti akan saya balas.

Happy Blogging!!

Berkomentar dengan Baik dan Jangan Buat Spam
1. Tidak semua pertanyaan sempat atau bisa dijawab.
3. Bagi yang mau tanya, sebelum bertanya, silakan cari dulu di Kotak Pencarian di Sidebar.
Thanks for visiting and the comment :)
Show EmoticonHide Emoticon