Pasang Bebarapa Floating Widget diBlog

Langsung saja, tanpa basa-basi :
  1. Masuk ke akun Google Anda
  2. Pilih Tata Letak >> Eleman Laman >> Add gadget (HTML/Javascript).
  3. Copy script master widget dibawah ini dan paste pada gadget.
<style type="text/css">
.barrightblogger{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghqtt6q-l5eBUCdXofaG5UkTNLMJGKENL-iKOWh6OonyCFwE2Up0pJt3fZzuG0Dxu6J_4T9QnJGVj4VoZ81Y565U-FyG_kPoG6kh9Th8yvegoMBhiqjwy4Rs8g0-ZK-0e3gPEOQuVjBsjK/);
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/AVvXsEh1JmVJgeYKdpB_Ut5Xmf38jCekXQqmxdW8tskp8NHKkG42-hNCZfBWhIByjC8w0-mLXOZO-R1VjnZSIg1G56FWMcO3ztZ0LcWmaP_R-g4vca7mySnWVa8KHf134o63Q6mJTkE5Wf1kIvyX/);
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/AVvXsEjgjGSBqWUh25lUe1lr1K1dT75PY-6UsU-PnXbjrU8W8Mqlg8XWUg4zvVVbYd06uhJyp1C1NWo_y9WV-vHzDLcMAkHnjy-GO75qVE-bbV14L3Fu__9TURVv1_JK9Llj0yhKP_S7XywnVp4_/);
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/AVvXsEi4uqVfNNAYjLA0PoIjryvtjZlOZJwPopJnroz61sElxl7ZMKnRyWTQDjA8YYv23JuWYQvVgOjKj1Ye5V4u9GXLwx4eTSomJgO1oqS8gZXusp9E5PdY6xBKD1AIVP01IB15yX5vavfPPkVL/);
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/AVvXsEgi2mntE8rISEp6Gu35iP1PLmD_FdMu9hYTm8YvAM4YfDzRg-8ojCMeCnMjapCPz0TkbeSrJ9SrGRTvjioescaiCWgBysZ0K6-38Jl2Lm8bhyphenhyphenGC9d3f1hBdHRtYk-UjSLgoLTL9B1D0AB0r/);
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/AVvXsEglDpGaPR3LDP3MgUfG3zVZHyi_FAUcOUrTgkvhM6hSx_aJ96Sv1wmTkNwKSGpZt6dzruvKqwzD5hsbwvwdSt6bP5wQtLscVjL2o_KgJrd5ErfkeATXdFgVDy41MEpl1NmfShndjtqXao8t/);
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>
Kustomisasi widget :
  • Ganti tulisan CONTENT BLOGGER HERE dengan kode HTML Google Friend Connect anda.
  • Ganti tulisan CONTENT TWITTER HERE dengan kode HTML widget status Twitter anda.
  • Ganti tulisan CONTENT FACEBOOK HERE dengan kode HTML Facebook Like Box anda.
 Bila anda masih bingung atau kesulitan untuk mengetahui kode ID Google Friend Connect (GFC), Facebook Like Box, dan Twiter Update berikut ini tutorialnya :
  • Cara Menambahkan Google Friend Connect Pada Blog
  • Cara Menambahkan Facebook Likd Box Connect Pada Blog
  • Cara Menambahkan Twitter Update Pada Blog

Share this article :

Posting Komentar

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Ariel Mukti - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger