10 May 2014

Cara membuat tombol share melayang di samping blog

Cara Membuat Tombol Share Melayang di Samping Blog untuk anda yang senang untuk share artikel atau segala hal yang terdapat di blognya, sepertinya anda  harus juga memasang tombol share melayang pada blog nya agar ketika anda melakukan share lebih mudah, lebih efisien dan lebih enjoy. Anda bisa melihat tombol share di blog ini terdapat dimana-dimana bukan? hal itu saya lakukan agar blog ini terus hidup dan tidak mati. ketika saya sedang tidak ada pekerjaan misalnya, ya lebih baik saya share artikel di blog ini ke social media dan lainnya. 




Oia teman, pada artikel ini kita akan belajar cara membuat tombol share persis seperti yang terdapat pada blog ini, yang terdapat di samping kiri. kalau anda senang, kenapa tidak anda klik share dulu lah, biar kita frend. nanti artikel Cara Membuat Tombol Share Melayang di Samping Blog akan saya buat dibawah oke.

Juragan bisa membuatnya dengan gampang kok, gak perlu buka editor html, karena kita hanya perlu langkah-langkah sederhana saja, ikutin yah :

Cara Membuat Tombol Share Melayang di Samping Blog


1. Buka Tata letak template blog juragan. 
2. Pilih tambah gadget
3. Pilih Html/Javascript
4. Copy kode yang terdapat dibawah ini 
<!-- Floating social media buttons by www.howbler.com --><style>
#floatingbuttons{background:#C12424;background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #F54F4F), color-stop(1, #C12424));background:-moz-linear-gradient(top, #F54F4F, #C12424);border:1px solid #B31919;float:left;padding:0 0 3px 0;position:fixed;bottom:15%;left:0;z-index:10;border-radius:0 5px 5px 0;box-shadow:2px 2px 5px rgba(0,0,0,0.3);} #floatingbuttons .floatbutton{float:left;clear:both;margin:5px 4px 0 4px;} .addbuttons{clear:both;text-align:center;padding-top:5px;} .addbuttons a span.getfloat, .addbuttons a span.sharebuttons{color:#fff;background:none;font-family:arial, sans-serif;display:block;font-size:9px;font-weight:bold;text-decoration:none;line-height:11px;} .addbuttons a:hover span{color:#fff;background:none;text-decoration:underline;}</style>
<div id='floatingbuttons' title="Share this post!"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><script type="text/javascript"> (function() { var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0]; s.type = 'text/javascript'; s.async = true; s.src = 'http://widgets.digg.com/buttons.js'; s1.parentNode.insertBefore(s, s1); })(); </script><!-- Medium Button --><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script><div class='floatbutton' id='facebook'><fb:like layout="box_count" show_faces="false" font=""></fb:like></div><div class='floatbutton' id='google+1'><g:plusone size="tall"></g:plusone></div><div class='floatbutton' id='twitter'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a></div><div class='floatbutton' id='linkedin'><script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="top"></script></div><div class="addbuttons"><a href="http://blogjuragan.com" title="Add floating social media share buttons to your blog!"><span class="getfloat">Get floating</span><div style="clear:both"></div><span class="sharebuttons">share buttons</span></a> </div> </div><!-- end Floating social media buttons by www.howbler.com -->

Semoga Artikel tentang  Cara membuat tombol share melayang di samping blog bisa bermnafaat untuk teman-teman sekalian. Salam sukses blogger. Apabila ada yang tidak dimengerti atau anda mengalami kendala dalam pemasangan kode script diatas, silahkan bisa bertanya pada kolom komentar dibawah ini. Terima kasih
 Baca Juga :

No comments:

Post a Comment