Cara Membuat Tombol Share Sosial Pada Blog versi Mas Sugeng


Cara Membuat Tombol Share Sosial Pada Blog versi Mas Sugeng

Membagikan blog pada sosial media memang sangat penting sekali untuk menambah jumlah trafik yang mengarah pada blog kita, apalagi jika kita baru saja membangun sebuah blog. Jumlah trafik akan mempengaruhi peringkat pada blog kita. Jika trafik blog ramai maka secara otomatis blog akan semakin populer apalagi jika pengunjung blog sobat merekomendasikan dengan cara membagikan konten pada blog sobat ke sosial media & ini merupakan teknik promosi gratis yang saya terapkan.

Untuk bisa membagikan artikel dengan mudah pada sosial media kita harus memasang alat untuk share ke sosial media dengan menambahkan Tombol Share Sosial pada blog. Dan kali ini saya akan membahasnya pada postingan kali ini. Cara Membuat Tombol Share Sosial Pada Blog versi Mas Sugeng tombol ini akan menghasilkan hasil seperti ini perhatikan gambar berikut.

Cara Membuat Tombol Share Sosial Pada Blog versi Mas Sugeng
Tombol share sosial media ini sudah saya terapkan pada blog saya sendiri dan berhasil karena tombol ini tampilannya yang unik dan lucu maka saya memasangnya pada blog ini. Dengan menambahkan tombol share sosial media kita berharap bahwa nilai sharing akan tinggi dibanding sebelumnya. Disebabkan kita memasang tombol share sosial media yang keren maka akan memicu pengunjung untuk menekan & membagikannya pada sosial media. Langsung saja ikuti langkah-langkahnya.

Cara Membuat Tombol Share Sosial Pada Blog versi Mas Sugeng

1. Login seperti biasa pada dasbor blog sobat.
2. Pilih Tema > EDIT HTML
3. Cari kode berikut ]]></b:skin> dan copas semua kode dibawah ini dan letakan persis diatas kode tersebut.
/* social share buttons */ .social-buttons-box { height: 67px; background: url(http://1.bp.blogspot.com/-OYT-JDviP2k/VHrWc3ofkiI/AAAAAAAAEJs/yyNAhuCUELA/s1600/rect3799.png) no-repeat 200px 0px; margin:20px 0 15px; overflow:hidden; } .social-buttons { margin:0 0; height:67px; float:left; } .social-buttons .share { float:left; margin-right:10px; display:inline-block; } .share-btn { margin:15px 0 25px; height:20px; overflow:hidden; }
4. Langkah selanjutnya cari kode berikut <data:post.body/>” atau “<div class='post-footer'> jika sudah ketemu copy dan pastekan semua kode berikut dibawahnya.
<div class='social-buttons-box'> <div class='social-buttons'> <div class='share gplus'> <div class='g-plusone' data-size='tall' expr:data-href='data:post.url'/> </div> <div class='share like'> <div class='fb-like' data-action='like' data-layout='box_count' data-share='false' data-show-faces='false' expr:data-href='data:post.url'/> </div> <div class='share tweet'> <a class='twitter-share-button' data-count='vertical' data-lang='en' data-size='normal' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a></div> </div> </div> <!-- <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>--> <div style='clear: both;'/>
5. Dibagian ini sobat sudah berhasil menempatkan tombol share bottom pada blog, Namun tombol tersebut belum berjalan sepenuhnya. Ada satu tahapan lagi yang perlu sobat lakukan yakni mengcopy semua script dibawah ini an letakan di atas kode </body> kita pasang script ini pada bagian paling bawah agar performa loading sobat tidak berkurang. Berikut scriptnya::
<script> window.___gcfg = {lang: 'id'}; (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script> <script> !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); </script><div id='fb-root'/> <script type='text/javascript'> //<![CDATA[ (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1&version=v2.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); //]]> </script>
6. Kemudia save.

Nah sekarang sobat bisa lihat hasilnya, jika sobat memasang kode diatas sesuai urutan yang saya sampaikan harusnya kode & script diatas berjalan secara normal. Cara Membuat Tombol Share Sosial Pada Blog versi Mas Sugeng harusnya berhasil dipasang di blog sobat. Dengan memasang tombol share bottom akan menambah nilai SEO pada template blog.

** Sobat Barusan Telah Membaca Postingan Tentang Cara Membuat Tombol Share Sosial Pada Blog versi Mas Sugeng Semoga Bermanfaat Dan Silahkan baca postingan kami yang lain, Terima Kasih.