Cara membuat tombol follow, twitter, dan facebook melayang

Cara membuat tombol follow, twitter, dan facebook melayang

Cara membuat tombol follow twitter dan facebook melayang. Ini merupakan versi terbaru di tahun 2012

Namun untuk tampilan yang sekarang lebih maksimal banget, soalnya terlihat lebih elagan dan widget juga besar. Untuk cara pembuatannya sangat mudah oke langsung saja di praktekkan.

1. Login blogger
2. Masuk rancangan, elemen widget
3. Add widgets
4. Pilih HTML/Javascript
5. Masukkan kode di bawah ini

<style type="text/css">
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2JGpbijNJUXGnAy_1eoml7YCNFLV0t5eQFq0j9eA-YyS11MRoJlXE6Zv-5CNnoWQr2de38Anrf5Gu7pwmd_UXt62rfO5aOB8BUAM2GXf7O6rHlgyFcskZ6uPACot8zHJ2HoO8tbcg118a/');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/AVvXsEiOhQuP5YmzoweD6Nv2YWlCHPXm9WW5GD9dHtiH5T7reu6AHQKwy3mrExuJZQuDzzfcn0Ooy3s4tLlPUarGfPg-14UTTd0EGiSvo-DlOqLDXjoycxNh05TRlqVPl4KRMN7RH5LvxoiYDEJH/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:50px; z-index:1100;}
.barconteblogger{margin:5px 0 0 47px}
.barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdHou_sKKAwizdchjy4yF4WV2oes5OHzFlPX0C353PgmNpgrlXpnhcjXfrHxRZ27J8glpvm-w97gZx4ne67yBPf1JRmMAkf0pbgS5__Ot2lQI-Ke5iFtjODO-YOlWhjlyQaHRHXCQd_M7b/');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/AVvXsEiP7XY8mF1XYp7ADPsh_NnUFEpifD7WzaEH-CgnaMllTL_lOPXQEn1zbzQAOgQGAW6GLXRvNeIHMlxwE8RhUwtBfky4vrhil7oYbvwk0quWGBcLIEac7cwDj9xTVORd2hjAwwal3JKrdlL4/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:185px; z-index:1100;}
.barcontefacebook{margin:5px 0 0 47px}

.barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxu2NKzwj8xVEsZfC88sG178lAt2LW6UIgBiia0oodrUbFDWJ3eFLzu9KUcF4ao08MS-SOplwkdgd-HdWLBxiC1toS3S69-yW7_GQvbJI1sKS1B-YQ_wXOzYZTJVWFAcL-g16vk-qGFUUK/');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/AVvXsEgTQtt8FC5zfIZaIT7bWM4HRAkfC3Djrlp5XmQi3Pd3vyykMuQ10GYaxzfusr_HOiRQcbM-eDgp9zwlyGJ7O3Z8zOYA8kdGJ8FwxNP_vwpaCuI6vXOseUQgYbzdiHYnvssdyWje98hGrBK7/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:120px; z-index:1100;}
.barcontetwitter{margin:5px 0 0 47px}
</style>


<div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'">
<div class="barconteblogger">
Copy kode google friend connect Atau Copy kode Cbox anda di sini
</div>
</div>


<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
<div class="barcontefacebook">
Copy kode Iframe fan page Facebook anda disini
</div>
</div>
<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">
Copy profile kode twitter anda disini
</div>
</div>

NB : untuk yang saya warnai merah, silahkan masukkan kode anda yang sudah di jelaskan seperti di atas.