cara membuat tombol sosial network dan subscribe atau berlangganan yang keren di blog ~ blog capoenk

http://3.bp.blogspot.com/-xOlY8Uo6ozU/UT1aEtv-C1I/AAAAAAAAAzo/GVJJ6Lvzin0/s1600/social.png

Bagi Kamu yang bingung bagaimana cara membuat tombol sosial network dan subscribe atau berlangganan yang keren di blog, nah kali ini Saya akan share caranya. Sebenarnya widget ini Sudah banyak di blog lain, tapi hanya saja warna dan gambar social newtork dan subscribe, baik itu dari facebook, twitter, google plus, rss, ataupun yang lainnya, kurang menarik kalau dilihat, kalau menurut Saya.

Widget yang Saya share ini, Saya modifikasi sedikit dalam hal warna dan gambar, seperti yang Kamu lihat di sidebar blog Saya.
Untuk caranya ikuti tutorial dibawah ini :

Log in ke blogger Kamu
Pilih tata letak, klik add gadget
Lalu masukan kode dibawah ini :

<style type='text/css'>
.social a{color: #000000;font: bold 12px Calibri,Helvetica, Arial, sans-serif;text-decoration: none;padding: 3px 5px 2px;position: relative;display: inline-block;text-shadow: 0 1px 0 #fff;-webkit-transition: border-color .218s;-moz-transition: border .218s;-o-transition: border-color .218s;transition: border-color .218s; background: #f3f3f3;border: solid 1px #dcdcdc;}
.social a:hover {color: #333;border-color: #999;-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);-webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);}
.social a:active{color:#000;border-color: #444;}
.sub-box{width:300px;background:();padding: 2px 5px 7px 2px;font-family:Droid Sans,Helvetica,Arial;}
.emailform{margin:16px 0 0; display:block; clear:both;}
.emailtext{margin:10px 0 0;background:#f6f6f6 url(https://lh5.googleusercontent.com/-OH13jbkUqGU/UTq6y3o3oVI/AAAAAAAAAyc/gSFYvTUdYeU/h120/email.png) no-repeat scroll 4px center;padding:6px 5px 6px 34px;color:#444;font-weight:bold; text-decoration:none;border:1px solid #ccc;width:175px;}
.emailtext:hover{background: #f3f3f3 url(https://lh5.googleusercontent.com/-OH13jbkUqGU/UTq6y3o3oVI/AAAAAAAAAyc/gSFYvTUdYeU/h120/email.png) no-repeat scroll 4px center;border-color:#8dd1f0;}
.emailtext:focus{outline:none;}
.sub-button{color:#eee;font-weight:bold; text-decoration:none;padding:5px 10px; border:1px solid #999;cursor:pointer;background:#8dd1f0}
.sub-button:hover{border-color: #8dd1f0}
</style>
<center><div class="social" style="padding: 0pt 0pt 0pt 5px;">
<table><tbody><tr><td>
<a href='http://feedburner.google.com/fb/a/mailverify?uri=blogcapoenk' target='_blank'><img alt='newsletters' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTOH8m1FBqTgxT8yuY0YPxuIOYuVSRJkA4anVpshFSd5rJBYrEvhKfbhNU98BkMUG6GrGfuewbGES00z77VKJP2iX1wUS1HlsGISd8b2gvtRh8SbMyFIx6NRk8ynSKsqKBilsQq7JhA812/" border="0" title='newsletters'/></a> </td>
<td> <a href='http://blogcapoenk.blogspot.com/feeds/posts/default' target='_blank'><img alt='rss' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjULYjm1kH2W6nxALyShhgjHP6BAoJuQ1SEYD-GIEcgJBbv6y4lfCz5SIIg1Ty2YHi5-IgL-FX3ThesB4Mv1ml2UET8RO-42k7gHo2mIqIoKfx4uM648BJyNth1v_vslqh8BzMGVNJbT3fS/" border="0" title='rss'/></a> </td>
<td> <a href='http://twitter.com/lindamarlina40' target='_blank'><img alt='twitter' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm63CfFbPQu02cBR9JQOPpT0m99W_b_7fzbOCSUA9KmJ4uSPb7lFytWoOVc37VvVRAjN2ODVV9vc6akALdutF6DIHLxwIJdmOvo3HXUwlMYBoQPJwJEKI1XiWdxOFsraROUaregj1BH7bO/" border="0" title='twitter'/></a> </td>
<td> <a href='https://www.facebook.com/pages/arieadie30/407369356012904' target='_blank'><img alt='facebook' src="https://lh4.googleusercontent.com/-j3KlErG10Tc/UTqhJUo8fyI/AAAAAAAAAyA/5nbqVa-0wRo/h120/fb1.jpg" border="0" title='facebook'/></a> </td>
<td> <a href='https://plus.google.com/u/0/109170993192526984262/' target='_blank'><img alt=' youtube' src="https://lh5.googleusercontent.com/-aHKQ0u731aU/UTqhJyuPSvI/AAAAAAAAAyI/vnDsOOkWGwU/h120/google-plus--px2.png" border="0" title='google+'/></a>
</td></tr></tbody></table> </div></center>
<center>
<div class='sub-box'>
<div style="text-align: left; display: inline-block;">
<h8 style="display:block;font-family:'calibri';font-size:15px;font-weight:bold;">Subscribe via RSS Feed</h8>
<small><i>If you enjoyed this article just <a href='http://feeds.feedburner.com/blogcapoenk' target='_blank' title='feedburner'>
<b>click here</b></a>, or subscribe to receive more great content just like it.</i></small>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogcapoenk', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="maskolis" name="uri"/>
<input type="hidden" name="loc" value="fr_FR" />
<input type="text" onblur="if (this.value == "") {this.value = "Enter your email...";}" onfocus="if (this.value == "Enter your email...") {this.value = ""}" value="Enter your email..." name="email" class="emailtext" />
<input type="submit" class="sub-button" value="Enter" title='' alt='' />
</form></div></div>
</center>
Keterangan :
- Teks berwarna ungu ganti dengan nama feedburner Kamu
- Teks berwarna hijau ganti dengan alamat blog Kamu
- Teks berwarna biru langit ganti dengan alamat twitter Kamu
- Teks berwarna biru ganti dengan alamat facebook Kamu
- Teks berwarna merah ganti dengan nomor akun Google+ Kamu (lihat di url G+ Kamu)
Simpan dan lihat hasilnya
Mudahkan, Selamat Mencoba,,,

Cara Membuat Tombol Share di Blog - Tombol share di Blog sangat bermanfaat untuk Blog anda. Karena para pembaca bisa membagikan Artikel anda, tentu saja Traffik Blog anda bisa meningkat. Kali ini Press Bloggers akan coba untuk membagikan Tips untuk Mempercantik Blog anda. Caranya dengan Membuat Tombol Share di Blog, terutama yang sering digunakan yaitu Tombol Share Facebook. Tapi disini lengkap Tombol Sharenya, selain bisa memikat pengunjung. Tombol share ini juga bisa membuat Blog terlihat lebih cantik. Oke langsung saja berikut cara Membuat Tombol Share Keren Memutar. Tombol Share berikut ini akan lebih keren dari yang lainnya, karena Tombolnya bisa memutar jika tersentuh oleh Cursor. cekidot: Pertama Login ke Blogger - klik Rancangan - Edit HTML - Centang Expand Widget ( Backup Template terlebih dahulu). Cari kode dibawah ini: Biasanya kode tersebut ada 2 di dalam Template, silahkan anda taruh kode dibawah ini dibawah kode yang ke dua. Jika sudah, Copy Kode dibawah ini dibawah kode ini:

Twitter Delicious Digg Facebook Stumbleupon RSS

Ganti URL Feed anda dengan RSS Feed Blog anda. Terakhir Klik Simpan Template. Lihat hasilnya.

Read more at: http://pressbloggers.blogspot.com/2012/12/cara-membuat-tombol-share-di-blog.html#.UVJHRSgQTDc
Copyright http://pressbloggers.blogspot.com

Cara Buat Tombol Share di Blog Keren Cara Membuat Tombol Share di Blog - Tombol share di Blog sangat bermanfaat untuk Blog anda. Karena para pembaca bisa membagikan Artikel anda, tentu saja Traffik Blog anda bisa meningkat. Kali ini Press Bloggers akan coba untuk membagikan Tips untuk Mempercantik Blog anda. Caranya dengan Membuat Tombol Share di Blog, terutama yang sering digunakan yaitu Tombol Share Facebook. Tapi disini lengkap Tombol Sharenya, selain bisa memikat pengunjung. Tombol share ini juga bisa membuat Blog terlihat lebih cantik. Oke langsung saja berikut cara Membuat Tombol Share Keren Memutar. Tombol Share berikut ini akan lebih keren dari yang lainnya, karena Tombolnya bisa memutar jika tersentuh oleh Cursor. cekidot: Pertama Login ke Blogger - klik Rancangan - Edit HTML - Centang Expand Widget ( Backup Template terlebih dahulu). Cari kode dibawah ini: Biasanya kode tersebut ada 2 di dalam Template, silahkan anda taruh kode dibawah ini dibawah kode yang ke dua. Jika sudah, Copy Kode dibawah ini dibawah kode ini:

Twitter Delicious Digg Facebook Stumbleupon RSS