Rabu, 13 Juni 2012

Cara Membuat Widget 3 in 1 Melayang (Blogger, Twitter, Facebook)




Cara Membuat Widget Melayang Google Friend Connect, Twitter dan Facebook Like Box :
1.   Login ke dashboard blogger anda, pilih Rancangan > Elemen Laman > Add gadget (HTML/Javascript).

2.       Copy script master widget dibawah ini dan paste pada gadget.
<style type="text/css">
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhfg-8GzRALvfdj4YtYe5uffSpoMLFqBqSTAM-iqyyi8JUJN1uqe92L_hyGxiAxx3emMHN9Iue_S-v8Lnq0W83QEJl4a2wqhFc0HXVtW0luQRu64W9X6xMlfKAJPipFrbm42BD-0ldFC-u/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:50px; z-index:1000;}
.barrightbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVAOmem_Bkegenp3aHC5fnkxzo0ljdmhnaLRDFCgB1zMg9sUshnepvFOXGUzBs5fh6kgPPrwsLDooJI2bHoZr_xPlJ-I9UYAiH08IvCuYKRlUfuDyIQ0sEQ1XHjggS1AH_RK6cT469CUVl/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:50px; z-index:1100;}
.barconteblogger{margin:5px 0 0 47px}
.barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5sGB__muMkSzQhmAW8Z3SO0tMhpQhD_BPO-agOobSCFsVJPnfaJrID-xK3VE3JAspcpy-hwpyu_Hb1DnH-sDYgcJ3ITQmFGtQfqJShuIvNKi0q0YAyzx4RR3h6ormbsaOM8pAOlKc9gaO/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:210px;z-index:1000;}
.barrighttwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcNAxrNiUOTd6Bi8pFpqHgHB6Ly_xJiaMXO1Tq2vAYBcZae412r2HCUi328ZdNIEucJN8_8DbQJfRrs4zwXC1-X25nRHM0rjJC4sT8l7jk3UriMf9YqcoSC_5y6rBG46CGufWdDUwsfidr/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:120px; z-index:1100;}
.barcontetwitter{margin:5px 0 0 47px}
.barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTh2-aJzXXQzCIwPke3DFixMsvM-5PXf6gg9a1eaEdEyz_lYBqE_8jrg0dIsAFO5-MQA9ht0OK6T9u29oa0a9k1P1UIiDphifIsePz_FxvSQmAjIuPt8zfgLai1L-0O_Vs0VFLDNvCXBO8/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:370px; z-index:1000;}
.barrightfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKoXAR89WE7XFczVEFndPPwVSDnHV8oEoId67toeNtVr2jjNMkzggYM4wI6M33CNaRu-HZdkbdByPbemjGxkAvuAVVEgducpl3297VFpTHxelAcARGVEiCGrJtC5gX9LLeuqD7RyamqqX6/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:185px; z-index:1100;}
.barcontefacebook{margin:5px 0 0 47px}
</style>
<div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'">
<div class="barconteblogger">
CONTENT BLOGGER HERE
</div>
</div>
<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">
CONTENT TWITTER HERE
</div>
</div>
<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
<div class="barcontefacebook">
CONTENT FACEBOOK HERE
</div>
</div>

aaa