Cara Membuat Tombol Share Menarik Tanpa JS

 
mungkin sudah banyak yang posting cara membuat tombol share, tapi kebanyakan itu-itu saja, nah pernahkan anda membuat tombol share menarik, unik dan simpel seperti ini.

Kita langsung saja :

• Login blogger sobat
• Kemudian klik pada Opsi lainnya, dan klik Template. (jika kurang jelas lihat gambarnya dibawah ini)

• Edit HTML. (jika kurang jelas lihat gambarnya dibawah ini)

• Klik Lanjutkan.
• Jangan lupa centang Expand Template Widget.
• Kemudia cari </head>, dan masukan kode dibawah ini tepat diatas </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'><style type='text/css'>.buttons a:visited{color:#fff}.buttons:hover{color:#fff;text-decoration:underline}.buttons{line-height:20px;color:#fff;text-decoration:none;border:1px solid #313c7d;padding:3px; font-family:arial,verdana,sans-serif;font-size:12px;font-variant:normal}</style></b:if>

•  Setelah itu cari <data:post.body/> dan masukan kode dibawah ini tepat dibawah <data:post.body/>

<div style='text-align:center'><a class='buttons' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' style=' background: #3b5998;' target='_blank'>FB Share</a> <a class='buttons' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' style='background: #4099FF' target='_blank'>Tweet</a> <a class='buttons' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' style='background: #c0361a' target='_blank'>Plus This</a> <a class='buttons' expr:href='&quot;http://www.reddit.com/submit?url=&quot; + data:post.url' style='background: #00BFFF' target='_blank'>Reddit</a> <a class='buttons' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url' style='background: #2F4F4F' target='_blank'>Digg</a> <a class='buttons' expr:href='&quot;http://en.oneview.com/myoneview/link/create/via/bookmarklet?URL=&quot; + data:post.url' style='background: #5F9EAD' target='_blank'>Oneview</a><a class='buttons' expr:href='&quot;http://www.linkedin.com/cws/share?url=&quot; + data:post.url' style='background: #00008B' target='_blank'>Linkedin</a> <a class='buttons' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url' style='background: #DC143C' target='_blank'>Stumbleupon</a> <a class='buttons' expr:href='&quot;http://technorati.com/faves?sub=addfavbtn&amp;add=&quot; + data:post.url' style='background: #7FFF00' target='_blank'>Technorati</a></div>

• Simpan template.