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/AVvXsEikSPcUmObQTGOW9nTMYqMMwxyO0mEetJb4UTdf-I6zQKsbPPbTWGPXLRli858qVxSvJijnWTtEVmwLS4OpLvBs7ibtrtB98aOtx828CKdlIBtU4ylT0pLS_9-rC2DSJ26VybhmDMlhOp8e/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/AVvXsEgT4L9yXMWkEF2qgNf_R1QeerCRjeoA4B10YPYSXEQ5Ndslbky9Zd8uMkSx2J0usd5HKQcSCQmdpILgdXcqrXSXd6jNz6fHbRgMUZk1UE33ld2yqQWwp-Rs4Uz1ZvY_AvzK0paNn1y9kK-W/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/AVvXsEgwQ3hRmVoXOM5YUw-KWa02X0xAdWBgxFggVLDCUMRp7RJ_9kxrCS42y46RUip2Y3ir9mlIR2U9J5JmX3-7xoVodDXNsMEWSg5YDfiYJnSVUdrAV7o9CF6nVqdW13zYBWUzqIqw2mG-wq07/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/AVvXsEiHrUjE5NplWntxGUEWdaKA2J52AvfX_M3IKy4y1S47AfU8pAHFegIK3g_CtKUHj7lwDXP_w09Kfsgr5mPUS4ueXoZ_LcG1XQpM2UCiMQoHKAkKaiwf6jA0tRbGuiVIz1N4zf2QdRkCoLIx/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/AVvXsEjKkdYo59fdXiXyI_sRIu-AtGudjFbHYss3X_JMGKmNMqXnlH42UxpI_vRXqb13gg1rwXColPac6UAAPdS0JiSNWx0mg3x0NdIWawH-JXR3PoGH8bfGG_U26oy-S6d9t_L7IL13ky4uhHgJ/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/AVvXsEjIB3H5wKPqSlxJnNUANIjBweCiH3MhyF7NLoVDTr1FyFKXbVJBMl9ipspHhJWCWzZn7RH0R7qDX_rkr9BbwIqkRpoCW3c4gijTP7OLp1nJKj1bCjbp8_coCXSMzMC-YqCkfWIhRczbn8_x/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/AVvXsEhz2nEnKI6VSy-_b9N3v4ry60xy0iAEwSQ0Z2h5o7DM7NXrexFD0HNR0mOf9nY6HQSvMuUvMxOSxi5D0PAmaEx1GhxWpvSLiVknwgxIKtdBi_wXN79F0CJ4lhbwfL7lCLXr-7e-QJeLgBg/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='yondark-kananblogger'' onmouseover='this.className='yondark-kananbloggerc''><div class='yondark-isiblogger'><a href='http://anonymous-bunshin.blogspot.com' target='_blank'><img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQofnZnYsC5ANOdQPenVqYWLmjuL1fOJzJMwE6bphKMtD1IptiGU-IH9MA4CfU4Uj5tGHHt4X9WEXzjKrFS1kaA30Lh-ehnpqysJmJFdpu4Bk31tUaPxr2uFkf2HWRtl1tGrZgFPTDmRwO/s1600/FB-open-new.png' title='Like us on Facebook'/></a><br/>
</div></div><div class='yondark-kanantwitter' onmouseout='this.className='yondark-kanantwitter'' onmouseover='this.className='yondark-kanantwitterc''><div class='yondark-isitwitter'><a href='http://anonymous-bunshin.blogspot.com' target='_blank'><img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiX6YiHlZ9HM-1YwO5K98ohM7WEpi-30CV0tsTqk344dhsTA18wDNpYT47C46L7lWZCNd8FBc9Pvwb14J7GCYXjo3ODM4HJ5wpkkOvRAsVVG-j1nSFohr44O6_fBMovmgaFJvnypfCYyONj/s1600/TW-open-new.png' title='Follow us on Twitter'/></a><br/></div></div><div class='yondark-kananfacebook' onmouseout='this.className='yondark-kananfacebook'' onmouseover='this.className='yondark-kananfacebookc''><div class='yondark-isifacebook'><a href='http://anonymous-bunshin.blogspot.com' target='_blank'><img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE1uQvAJtyWxDhLUurGuoPeTDZaIKy5YUxdcXbDlWjs34GaTdrqOwbFtI4pCbJbSnAFV1XnbfxMVRkZLv2zQFWxBcDnpSG6gM3VVAE2-DCvMWUm-lTI1BoC13oGJef-c_j5YaFhXgYVAcw/s1600/G+-open-new.png' title='Recommend us on Google Plus'/></a><br/>
</div></div><div class='yondark-kananrss' onmouseout='this.className='yondark-kananrss'' onmouseover='this.className='yondark-kananrssc''><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
Bagaimana? Keren? Sekian artikel Cara Membuat Widget Social Network
Keren Di Blog. Semoga bermanfaat. Jikia ada yang kurang jelas silakan
tanyakan di komentar.
izin nyedot gan! makasih gan
ReplyDelete