Tuesday, April 2, 2013

Cara Membuat/Memasang Kotak Like Fb dan Twitter Tersembunyi Di Blog

Pada hari ini saya akan share bagaimana Cara Membuat/Memasang Kotak Like Fb dan Twitter Tersembunyi diblog anda. Nampaknya sudah cukup saya berbicara langsung saja, ini dia cara membuat/memasang kotak Like fb dan twitter tersembunyi di blog :


1. Masuk ke akun blogger sobat
2. Klik tanda panah ke bawah di samping Daftar entri
3. Klik Tata letak
4. Klik tambah gadget
5. Klik HTML/JavaScript
6. Masukan Kode di bawah ini.
<style type="text/css">
.barrightfacebook{background:url('http://1.bp.blogspot.com/-3xq-Se4UF9w/TpOxNLDMYmI/AAAAAAAAAOM/yaPj4IUjnQ0/facebook.png');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:320px; z-index:1000;}
.barrightfacebookc{background:url('http://2.bp.blogspot.com/-Cum28YwF4d8/TpOxM_lUKMI/AAAAAAAAAOE/L4pJ91PTVz4/facebook.png');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('http://1.bp.blogspot.com/--gRMUITrjwM/TpOxLpClllI/AAAAAAAAANs/l88iteOo244/twitter.png');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:160px;z-index:1000;}
.barrighttwitterc{background:url('http://2.bp.blogspot.com/-B97DZMK7wus/TpOxNSwRhPI/AAAAAAAAAOU/A-RjcC6WYjk/twitter.png');background-repeat:no-repeat;width:288px;height:45px;position:fixed;right:0px;top:80px; z-index:1100;}
.barcontetwitter{margin:5px 0 0 47px}
</style>



<div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'">
<div class="barconteblogger">


</div>
</div>



<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
<div class="barcontefacebook">

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FRahmanCiblog&amp;width=292&amp;height=290&amp;colorscheme=dark&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=true&amp;appId=220391438067645" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:290px;" allowtransparency="true"></iframe>

</div>
</div>

<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 20,
  interval: 30000,
  width: 250,
  height: 300,
  theme: {
    shell: {
      background: '#040504',
      color: '#ffffff'
    },
    tweets: {
      background: '#098cf0',
      color: '#ffffff',
      links: '#4aed05'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: true,
    behavior: 'all'
  }
}).render().setUser('@Rahman_ciblog').start();
</script>

</div>
</div>
Catatan:

  •  Kode yang saya beri warna merah ganti dengan Username FansPage sobat.
  • Kode yang saya beri warna biru ganti dengan Username Twitter sobat.


6 comments: