Cara Membuat Tombol Social Network Keren Di Blog

Cara Membuat Tombol Social Network Keren Di Blog

Keyword : Cara Membuat Tombol Social Network Keren Di Blog, Cara Membuat Tombol Facebook, Tweeter, Dan G+ Di Blog, Cara Membuat Tombol Social Network Keren Dengan Css.

Kali ini saya akan mengshare sebuah tutorial blog lagi. Cara Membuat Widget Social Network Keren Di Blog. Untuk yang belum tahu dengan maksud dari Widget Social Network ini, kalian bisa melihatnya di gambar di atas. Maaf tidak ada demonya.

Nah, bagaimana cara membuatnya? Berikut ini adalah Cara Membuat Widget Social Network Keren Di Blog.

• Pertama, masuk ke Dasboard blog kalian
• Pilih Template
• Pilih Edit HTML (Jangan lupa centang Expand Template Widget)
• Cari kode ]]></b:skin>
• Masukkan kode di bawah ini tepat di atas kode ]]></b:skin>

/*Social Network*/
.yondark-kananblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDiypbfbUbeDMOC44uoHZS6Ic6lxbbhByiq-8YvpQhnhyphenhyphenS0qhdtAUdVW1BBfYvUoYe1G8vGox3Qlt-oPipkO9alg3wVmKg4kUO1JBPYlt77SPohpgLaQWiDFOqoRdj7FV8Dab6OCOSQBm4/s1600/FB.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}
.yondark-kananbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIJBHLWaEF6pVFKRDiMSArA7Ll31GCEAbJH_C0SPOJaxvBK5PQuQGT-Y80RoxhbzrYPF9c5wCfTkK7bwdiu67q2hnMaTopuZ02bTU-IRj0EwT2FpRYMUikfrLNWb10lnOKr04lVPkrk7gk/s1600/FB-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}
.yondark-isiblogger{margin:0px 0 0 43px}
.yondark-kanantwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWnmY2HM8h7sgt1XFKK4TS800wzlMx-m_MDC5KZXC5475yZUq7FbYsBw5dCXCugqCe5YWnJaYOipxNx9F7TaehAQx1HmwLryvOwmNwFZJ99xTbWgYOpJPR0OXJlCik8TQ85FxDRxW1aZSq/s1600/TW.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}
.yondark-kanantwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLsCk_6x-_sdLHjwPl04kMhv6kGzcLL6q0dxQzfa7n2v6_mMh4UvXBXhBrUjAH8LS9rN_SEp40AxH55Gs_gl9L1f02lzOWIltgzWrLCmRv6d7H7nPRwX0hy74YTFbnooMZVHxAFwm2qab7/s1600/TW-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}
.yondark-isitwitter{margin:0px 0 0 43px}
.yondark-kananfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyE9KXJFN0OyMlEqCe2xffRDMK7H-wLeayT_ds-U-SHhpr4NggZUhVNyGAhvl8PARpkZ5Vgwjho_c_JKkxyjSW6Hlo_NAjv-0z80VfsJSts4fXltNeqs83FyKShZpRmspyv23nawFL2HeJ/s1600/G+.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}
.yondark-kananfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpQp6pkb_xhnXLEw9lP0XNAup0HCRz5r2lrDP4Tgcj2VhT8Y2P4nQhnxeX18dn5iRovZirFr7iT94_TH-pApTPfMlTxF9yhEz4lPUsxs2ODJsfMb_axlQdfxZk4vDtX6pw8ePXjpLnnScQ/s1600/G+-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}
.yondark-isifacebook{margin:0px 0 0 43px}
.yondark-kananrss{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxUqMkqSWQbIcoAoPyMXyouLbUplPJoWnVvzsM7YEVLvxqJdT5PAN3bnCCdc9TFqc8lP7bg21PbTS1V7KbiUsesU-caG0vrUKNQi_t8YzChggUCOeB2I5PGA7IkT-ajIKE5oLJh7fxSzI/s1600/rss.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}
.yondark-kananrssc{background:url('http://1.bp.blogspot.com/-RZyN5DznuUY/UUa9Uc04tFI/AAAAAAAAAi8/okz_LnBFNS4/s1600/RSSjoss.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:295px; z-index:1100;}
.yondark-isirss{margin:0px 0 0 43px}

• Masih belum selesai, masih di Edit HTML cari kode </body>
• Masukkan kode di bawah ini tepat di atas kode </body>

<div class='yondark-kananblogger' onmouseout='this.className=&#39;yondark-kananblogger&#39;' onmouseover='this.className=&#39;yondark-kananbloggerc&#39;'><div class='yondark-isiblogger'><a href='http://amaterasu-bunshin.blogspot.com' target='_blank'><img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpAYiVUOr4fi-Ev4M69wl1pz-o4PBAaQ-edyCzyoeGklSDSqi17mGaUogRs7pkSGsQrOAs1QeAeqsBLj9mQpFkpXYZ3ABTBnGqz9Y6SsPfda4erPGjb2r4Iv2YFVQ-wMm-YdpFabkqQclJ/s1600/FB-open-new.png' title='Like us on Facebook'/></a><br/>

</div></div><div class='yondark-kanantwitter' onmouseout='this.className=&#39;yondark-kanantwitter&#39;' onmouseover='this.className=&#39;yondark-kanantwitterc&#39;'><div class='yondark-isitwitter'><a href='http://amaterasu-bunshin.blogspot.com' target='_blank'><img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfYBtUXrbFpCcB6nlrpuoFEnd2ORKgwx8nuuBmuQD6Wmfv0bgX6XhcqzV-KQ8o-KbEJhS8DkgN97QyjNeOGM4wiuTHQvfJ1XspHSTyxLSw3jInPLJ4kuWl8GyxuACPEWcdPqLT-P6Ol_1Z/s1600/TW-open-new.png' title='Follow us on Twitter'/></a><br/>

</div></div><div class='yondark-kananfacebook' onmouseout='this.className=&#39;yondark-kananfacebook&#39;' onmouseover='this.className=&#39;yondark-kananfacebookc&#39;'><div class='yondark-isifacebook'><a href='http://amaterasu-bunshin.blogspot.com' target='_blank'><img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp8GZCUSnHvNCqMSlxZmUn5NK4nI_z6XXpIMpV6K0iTmlvP35dvL_NBX1l9Lzsl4xwXAp1qSDVjiLLjkOOtWeoKVFRkOCzd2FPdSrb9sewE2SK-Rgm0LxHwp0PJTBTHQDcX50Fxz32NqgN/s1600/G+-open-new.png' title='Recommend us on Google Plus'/></a><br/>

</div></div><div class='yondark-kananrss' onmouseout='this.className=&#39;yondark-kananrss&#39;' onmouseover='this.className=&#39;yondark-kananrssc&#39;'><div class='yondark-isirss'><a href='http://anonymous-bunshin.blogspot.com' target='_blank'><img alt='Subscribe me on RSS' src='http://3.bp.blogspot.com/-MDAVOH3vOYU/UUa9UYMZCJI/AAAAAAAAAjA/YicU-mlZMrY/s1600/RSSjosspendek.png' title='Subscribe me'/></a><br/>

</div></div>

•  Terakhir tinggal di Save

Keterangan :

Ganti kode berwarna BIRU dengan alamat/URL Facebook kalian

Ganti kode berwarna MERAH dengan alamat/URL Twiiter kalian

Ganti kode berwarna KUNING dengan alamat/URL G+ kalian

Ganti kode berwarna UNGU dengan alamat/URL Rss Feed kalian

Sumber Artikel : http://anonymous-bunshin.blogspot.com/2013/03/cara-membuat-widget-social-network.html#ixzz2QJiIaFBO

Related Post: