Jika anda sudah memiliki website sendiri, tentunya anda ingin tampilan website anda menarik buat dilihat oleh banyak pengunjung, selain modern dan keren pengunjung betah berada di website anda.
salah satunya yang buat blog anda terlihat menarik, yaitu memasang widget.
disini saya akan memberikan pada anda widget social facebook, twitter dan G+1 dengan tampilan slider dan menarik.
berikut screen shotnya :
Menarik bukan?
jika anda tertarik, ikuti saja langkah-langkahnya di bawah ini.
salah satunya yang buat blog anda terlihat menarik, yaitu memasang widget.
disini saya akan memberikan pada anda widget social facebook, twitter dan G+1 dengan tampilan slider dan menarik.
berikut screen shotnya :
jika anda tertarik, ikuti saja langkah-langkahnya di bawah ini.
- Masuk ke akun blogger
- Tata Letak/Layout
- Add gadget
- Add/Edit HTML
- Copy Paste kode di bawah ini :
| <script src="http://code.jquery.com/jquery-latest.js"></script> <script src="http://apis.google.com/js/plusone.js" type="text/ javascript"></script> <link rel="stylesheet" type="text/css" href="https://dl.drop boxusercontent.com/s/m4krejz6tw6sxlf/3%20in%201%20StyleSheet.css" /> <script src="https://dl.dropboxusercontent.com/s/e5p8j4qnfvgda8p/ 3%20in%201%20Widget.js"></script> <div id="on"> <div id="facebook_right" style="top: 12%;"> <div id="facebook_div"> <img alt="" src="http://3.bp.blogspot.com/-wQUpmiGwynE/UNHJaesfqeI/ AAAAAAAAItg/JQlnTuoFRnQ/s1600/NBTfacebook_right.png" /> <iframe allowtransparency="true" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/likebox.php?href= http%3A%2F%2Fwww.facebook.com%2FCoMetSHaRE&width=200& height=346&colorscheme=light&show_faces=true& border_color&stream=false&header=false" style="border: none; height: 346px; overflow: hidden; width: 200px;"> </iframe> </div> </div> </div> <div id="on"> <div id="twitter_right" style="top: 28%;"> <div id="twitter_div"> <img id="twitter_right_img" src="http://3.bp.blogspot.com/-UrPbwWyd88E/ UNHJhIlDSRI/AAAAAAAAIt4/fmis0qzbcfI/s1600/NBTtwitter_right.png" /> <div style="width:248px;font-size:8px;text-align:right;"> <script type="text/javascript"> document.write(unescape("%3Cscript src='http://twitterforweb.com/twitterbox.js?username=@IkhsanGaozhan& settings=0,1,2,248,279,ffffff,0,c4c4c4,101010,1,1,336699' type='text/ javascript'%3E%3C/script%3E"));</script><a href="http://cometshare.blogspot.com/" target="_blank"></a></div> </div> </div> </div> <div id="on"> <div id="google_plus_right" style="top: 45%;"> <div id="google_plus_div"> <img id="google_plus_right_img" src="http://2.bp.blogspot.com/-e2uAzeEjWU4/UTHxwZv6O_I/AAAAAAAAACo/ IIkUjVUrtus/s1600/NBTgoogle_plus_right.png" /> <div style= "float: left; margin: 10px 10px 10px 0;"> <a href='http://cometshare.blogspot.com/'> <img alt='Comet Share' src= 'http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/ xo2eFaDbfrE/s1600/best+blogger+tips.png' /> </a> <div class="g-plus" data-action="followers" data-height="250" data-href="https://plus.google.com/101354035066564687263" data-source=" blogger:blog:followers" data-width="270"></div> <script type= "text/javascript"> (function () { window.___gcfg = { 'lang': 'en' }; 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> </div> </div> </div> |
Keterangan :
- Kode berwarna Merah ganti dengan ID Fans page facebook anda
- Kode berwarna Hijau ganti dengan ID twitter anda
- Kode berwarna Biru ganti dengan ID Google Plus anda.
