Membuat Dynamic Social Bar tanpa Edit HTML

Social Bar
Salam Blogger! Pada kesempatan ini Bang Kamplenk akan mengshare tentang cara Membuat Widget Dynamic Social Bar keren, unik dan mudah digunakan, dalam penerapannya tidak perlu Edit HTML,dan tidak memberatkan loading blog anda. Bila ingin mencoba langsung saja ikuti tutorialnya dibawah ini : 
D E M O



1.Klik Tata Letak.
2.Klik Elemen Halaman.
3.Klik Tambah Gadget.
4.Kemudian Pilih HTML/Javascript.
5.Copy paste kode dibawah ini :

Semoga Bermanfaat.

<style>
.sosmed-kananblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVN4P3xvHyTP0pNeu1P6ZlLLFwWj54Fb7wBHJsYrHSmtA9JyYmU1m4z6dAfCtgjFS1WS_lQjoBY3p-XhxTD5cIj0rRmDV1bGFiXBKWqyoS210FAOBx5GmB1aS0jQJMt3ZHCpMzrj4zvZbV/s1600/FB.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:160px; z-index:1000;}
.sosmed-kananbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihn71SbQU1k56pUGY49QxqTfTkAD83vHyiny_lDp3udLfWK3pbj8I41ynm9yfIxkFRss_mU2jWLxxK3525ORmTp04EtRVVf1W2UXlhlTguXPNBKB0XJzrHDLzx26y-Hjz1X-YdwrH0tjW2/s1600/FB-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:160px; z-index:1100;}
.sosmed-isiblogger{margin:0px 0 0 43px}
.sosmed-kanantwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfMspOzE3KhakY5zavOUTHOBfDrN7jdmAG-1j8JVxgOSX9WtgBVbzReP6jh-7rccVmYKXEtvPujtn2Cpa9zy2KVl1oFIb__TLk14EnoKnDG430Gln5vbJ6SXip4mDq5WdY5oJARQfk40QT/s1600/TW.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:205px;z-index:1000;}
.sosmed-kanantwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUH9jkUKPFpUfZbI3gF2dCIQhSIMJDmp697LkmoplLMXx45TY6Yta9i6fXjux5SawUp70_eqcVRBM2l0adPNdCOuXflEFQ9SbRi9atUB5oTYXDALneCQusdF_kWkU7hYuBZpesDYSoeN3J/s1600/TW-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:205px; z-index:1100;}
.sosmed-isitwitter{margin:0px 0 0 43px}
.sosmed-kananfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO6yPtOHBxwIhyPtz3vcDAP7GsIS4x7g4_rOnT-DeVclWeg2quWiMmHKmb_aRuGD1Vy22ZFLNZKdxxRJmo6L6i3PshfrNOs3NcLVO1ckpJJA99GgsaTlsCq9QC_l71NBNsAQ0H8vU-RKIp/s1600/G+.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:250px; z-index:1000;}
.sosmed-kananfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWyxI8ZtjuCYdKpzuE_9_4MbwyQDH9e8bs6ivv-u9_06_xc_0P1o3-V8siE018yyqEFQdXDYWCWG9wA_LEDvqLNRBNcqenZPHxrlRZsKz1F0Tf5_jtG-kWShyphenhyphenIyVYIm4rK1ObNL67sRR_7/s1600/G+-open.png');background-repeat:no-repeat;width:150px;height:43px;position:fixed;right:0px;top:250px; z-index:1100;}
.sosmed-isifacebook{margin:0px 0 0 43px}
.sosmed-kananrss{background:url('http://2.bp.blogspot.com/-A2gUy4WF8l8/UUa2igFbIZI/AAAAAAAAAiM/2ck6-Wot2yM/s1600/rss.png');background-repeat:no-repeat;width:43px;height:43px;position:fixed;right:0px;top:295px; z-index:1000;}
.sosmed-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;}
.sosmed-isirss{margin:0px 0 0 43px}
</style>
<div class='sosmed-kananblogger' onmouseout='this.className=&apos;sosmed-kananblogger&apos;' onmouseover='this.className=&apos;sosmed-kananbloggerc&apos;'><div class='sosmed-isiblogger'><a href='https://www.facebook.com/XXX' target='_blank'><img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsr7mwMMG-cAaQe5_acPnKB6OAc-y5sQcUjwM8OqlGNAnLUzzNONxC7OLP4LOnUYo9YUrYnmhu3unKzinxIVw3cMW4SjA5lkdjDSawTAzMUclJn2-dAYyUpNmOMPmfObGJvyQhjA7ITXz_/s1600/FB-open-new.png' title='Like us on Facebook'/></a><br/>
</div></div><div class='sosmed-kanantwitter' onmouseout='this.className=&apos;sosmed-kanantwitter&apos;' onmouseover='this.className=&apos;sosmed-kanantwitterc&apos;'><div class='sosmed-isitwitter'><a href='https://twitter.com/XXX' target='_blank'><img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpwSHi1F2vHDPLYuO9KlkM9OCtNYY1xzupFrrWcVZUgpay-16mfwpBPcXBPaY552sh63c1XhLjOAfInfFBUXf7tRwQ6bMNHigXbobjPMnyRxHJpELb0xkllj4zAsfqAj68Y7LJXJxvSPxH/s1600/TW-open-new.png' title='Follow us on Twitter'/></a><br/>
</div></div><div class='sosmed-kananfacebook' onmouseout='this.className=&apos;sosmed-kananfacebook&apos;' onmouseover='this.className=&apos;sosmed-kananfacebookc&apos;'><div class='sosmed-isifacebook'><a href='https://plus.google.com/your googleplus/posts' target='_blank'><img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmzocUJvErUUmSBb5ox_xl5Qyzn1AccVEFAiPA-0OD6H1ZvUrx7jRMp8lS_iuisXwqWtUl_CKPJchhPnicBOU1fdXijI4OcEzlCgeJrUoqcx9CYiggIOITTECjwdL7a11mAavH0PIE9ueY/s1600/G+-open-new.png' title='Recommend us on Google Plus'/></a><br/>
</div></div><div class='sosmed-kananrss' onmouseout='this.className=&apos;sosmed-kananrss&apos;' onmouseover='this.className=&apos;sosmed-kananrssc&apos;'><div class='sosmed-isirss'><a href='http://feeds.feedburner.com/XXX' 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>
C O D E

Related Posts:

  • Cara Membuat Favicon Blog Sendiri Favicon Generator Salam Blogger! Favicon adalah ikon utama yang muncul pada addres bar pada Blog ataupun website, Ikon ini adalah sebagai Logo brand suatu Web, bagi anda yang ingin membuatnya sendiri silahkan ikuti langk… Read More
  • Membuat Bookmark Share tanpa Edit HTML Bookmark Share Salam Blogger! Widget pintas ini adalah untuk mempermudah pengunjung membookmark atau menyimpan Blog atau Wibsite anda dengan mudah dan cepat karena tinggal klik saja, ikuti panduannya dibawah ini 1.Klik … Read More
  • Membuat Tombol Share Telor Ayam Share Telor Ayam Salam Blogger! Bagi sahabat pembaca paling setia Blog ini yang ingin mempercantik tombol share, saya akan membagikan model terbaru yaitu Membuat Tombol Share Post Telor Ayam, bagi yang ingin mencoba sila… Read More
  • Membuat Menu Mini Vertical tanpa Edit HTML Menu Mini Salam Blogger! Bagi pengunjung setia kali ini saya akan membagikan bagimana Cara Membuat Menu Mini Vertical tapa edit HTML seperti gambar, silahkan ikuti langkahnya di bawah ini : 1.Klik Tata Letak. 2.Klik &nbs… Read More
  • Membuat Menu Oval Bergerak tanpa Edit HTML Salam Blogger! Pada malam ini saya akan membagikan Cara Membuat Menu Oval Bergerak, sobat tidak perlu banyak merubah kode hanya sedikit pengeditan menyesuaikan keinginan sobat, karena tanpa melakukan edit HTML, pada p… Read More

2 komentar:

  1. keren nih gan
    izin coba yaa
    salam kenal

    BalasHapus
    Balasan
    1. Salam kenal juga ;)
      Silahkan dicicipin....

      Hapus

Silahkan sobat tinggalkan jejak di bawah ini...NO.SPAM
Dengan Memberikan Komentar Secara Otomatis akan Mendapatkan Pagerank, Traffic dan Backlink.