Postingan kali ini kita akan membahas tentang 3 in 1 Floating Widget.
Apa itu 3 in 1 Floating Widget..?
3 in 1 Floating Widget adalah widget yang menampilkan tiga buah widget, yaitu Google Friend Connect, Twitter, dan Fans Like Box Facebook yang melayang dalam satu widget.
3 in 1 Floating Widget adalah widget yang menampilkan tiga buah widget, yaitu Google Friend Connect, Twitter, dan Fans Like Box Facebook yang melayang dalam satu widget.
Mau..?
Ikuti langkah – langkahnya :
1. Masuk Dasbor
2. Klik Rancangan
3. Klik Tambah Gadget
4. Pilih HTML/Javascript
5. Copy kode berikut
<style type="text/css">
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjF_D9p_giHVDSolMtwzIX7N5qq2Xr3YEajuHsAhFJuTRS43XBi9inLAsh4tqPn7NGW0ir9gh1cTvgdQGI_fAbj0wG5UWbPXISBDrr0kx_ocXVa2D7acLtwxTA3DLGU0_jfLxwbY-97wYD-/');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/AVvXsEgXGOi198avUNw2jR1OX9c_aO6gmGwVHbzZJEMtVZc1S9YKFV6voWKUh1oMZOO4YlXyLE-wRLfcwIvhdjGQi79mDd-hnoe9yUi5MjvT0ERHaisf0AcvGJTri3GZEAN7TMOzA5NI7FlgqHne/');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/AVvXsEif0vLJGkiRMGXhBKZdkqYdBeDic8bKmsBt0LlJonlbXjitKsWXgmadKGYhf8k_H5RNIXff_p-BktSUod5N47zV7U1GuJU65MXcJoPP6OceLZdxKtC_e75BO89oLQPKiI7BdSVVlU_44S-5/');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/AVvXsEgiuftNR3C6lbGoVDvf_JMrnzQAjcqXohLeAN7uyOhgyVnkSMrugR2iwyp6Lz-diJ3tbe2tbaQ4aRNPPHzHdRDsQJmEK7FisGHU0fRNatetSEulsZ8l905BT9er5pzF3QacG7RVI4yY0ki0/');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/AVvXsEjni9zx7fI8wade2ULQwoc7OdBQY69XZ-fplj5jEfsr9-lSf7Uydgmlxt33qs_bHJZAqi-JzFdmSwaaPNjST4HsBN1sCa7uuu-jvo5AnhhvFCw1FqgkBrJKEqygyigFawNY8brcK5Xp_FtQ/');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/AVvXsEjHAcItAJAtGpoRqHu9ZYfyEWIqTeIYLdVoFUa0hbukI5Fu7OhdgvXdOkow3xqjP-YniRIxDXWeRziEPnQ-KowORr9ig-GuKgsLk4HN8zL-04U9TnmbZJNtPxZnlT8H3fjYawmafffAiKbT/');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">
KODE BLOGGER
</div>
</div>
<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">
KODE TWITTER
</div>
</div>
<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
<div class="barcontefacebook">
KODE FACEBOOK
</div>
</div>
Keterangan :
Ganti tulisan KODE BLOGGER dengan kode HTML Google Friend Connect anda.
Ganti tulisan KODE BLOGGER dengan kode HTML Google Friend Connect anda.
Ganti tulisan KODE TWITTER dengan kode HTML Widget Status Twitter anda.
Ganti tulisan KODE FACEBOOK dengan kode HTML Facebook Fans Like Box anda.
6. Paste di Jendela HTML/JavaScript
7. Klik Simpan
Jika anda belum tahu Kode Blogger anda, Kunjungi Google Friend Connect, untuk Kode Twitternya, Kunjungi Twitter, dan untuk Facebook, Kunjungi Facebook Like Box.
Sekian postingan kali ini.
Baca juga artikel tentang Cara Membuat Floating Like Box Facebook Di Blog.
Semoga Bermanfaat. Terima Kasih.
Baca juga artikel tentang Cara Membuat Floating Like Box Facebook Di Blog.
Semoga Bermanfaat. Terima Kasih.
0 comments:
Komentar Anda Sangat Bermanfaat
Silahkan Berkomentar !