Cara membuat Widget sosial media lengkap

Cara membuat Widget sosial media lengkap

Widget sosial media - Adalah widget yang berisi tombol like dan profile, contohnya seperti facebook,google plus,twitter,dan blogger. Bagi saya widget ini sangat diperlukan dan penting, karena diutamakan untuk pengunjung blog dapat berintraksi dengan admin di sosial media seperti facebook dan twitter.

Cara membuat widget sosial media lengkap
Widget sosial media lengkap

Widget sosial media yang saya share demo nya seperti gambar diatas, jika anda tertarik untuk memasang Widget sosial media lengkap silakan ikuti tutorial dibawah ini, jika anda tertarik untuk memasang widget sosial media keren di blog silakan baca artikel saya tentang cara membuat widget metro style keren.

Cara memasang widget sosial media lengkap

1. Pertama silakan masuk ke blog anda
2. Selanjutnya anda ke Template dan Edit HTML
3. Simpan kode dibawah ini diatas kode </body>
<script type='text/javascript'>
//<![CDATA[
(function(){var fb1=document.createElement('script');fb1.type='text/javascript';fb1.async=true;fb1.src='http://connect.facebook.net/id_ID/all.js#xfbml=1','facebook-jssdk';var fb2=document.getElementsByTagName('script')[0];fb2.parentNode.insertBefore(fb1,fb2)})();(function(){var tw1=document.createElement('script');tw1.type='text/javascript';tw1.async=true;tw1.src='http://platform.twitter.com/widgets.js';var tw2=document.getElementsByTagName('script')[0];tw2.parentNode.insertBefore(tw1,tw2)})();(function(){var gp1=document.createElement('script');gp1.type='text/javascript';gp1.async=true;gp1.src='https://apis.google.com/js/plusone.js';var gp2=document.getElementsByTagName('script')[0];gp2.parentNode.insertBefore(gp1,gp2)})();
//]]>
</script>
4. Kemudian anda ke Tata letak dan tambahkan gadget lalu ke HTML/Javascript
5. Simpan kode di bawah ini di HTML/Javascript 
<div style="background:#3498db;font-weight:bold;font-size:150%;text-align:center;padding:10px 0;"><a href="http://www.blogger.com/follow-blog.g?blogID=7624364954761638207" target="_blank" title="Follow this blog"><span style="color:#fff">Join</span> <span style="color:#000">Now</span></a></div><div style='background:#fff;margin:0;border:1px solid #ccc;border-bottom:none;border-top:none'><div style='background:#fff;margin:0;'><div class="fb-like-box" data-href="https://www.facebook.com/ilhamwulan12" data-colorscheme="light" data-show-faces="false" data-header="true" data-stream="false" data-show-border="false"></div></div><div style="background:#fff; border-top:1px solid #ccc;margin:0; padding:5px 0 5px 40px"><a href="https://twitter.com/WulanNuraisyah12" class="twitter-follow-button" data-show-count="true" data-show-screen-name='false' data-lang="id">Ikuti @WulanNuraisyah</a><div class="g-plusone" data-size="medium" data-count="true" data-width="100" data-href="http://wulan-tasik.blogspot.com"></div></div></div><div class="g-person" data-href="//plus.google.com/106454487376695856392" data-layout="landscape" data-rel="author"></div>

Keterangan : 
1. Ganti kode 7624364954761638207 dengan blog ID anda
2. Ganti https://www.facebook.com/ilhamwulan12 dengan URL profile facebook anda
3. Ganti yang warna hijau dengan URL Profile Twitter anda
4. Ganti yang berwarna biru muda dengan Username twitter 
5. Ganti yang berwarna biru tua dengan alamat url blog anda
6. Ganti yang warna ungu dengan ID Google Plus anda




2 comments:

  1. nice info gan, jadi bisa mempercantik blog ane jg gan.

    ReplyDelete
    Replies
    1. Sama-sama bang, terimakasih sudah berkunjung :D

      Delete

Contact Us

Name

Email *

Message *

Back To Top