CARA MEMASANG WIDGET LIKEBOX KEREN


   Kali ini saya akan mempostingkan trick membuat widget likebox melayang . Sebagai contoh bisa dilihat dibawah ini . 
    Oke deh langsung serep aja nih  :
1.Masuk ke BLOGGER
2.Langsung ke tataletak
3.Tambah gadget > pilih yang HTML/JAVASCRIPT
4.Masukin dah nih kodenya :






<!-- FB melayang tombol close --!>
<style type='text/css'>
#kotak-facebook {
      position:fixed !important;
      position:absolute; /* IE6 */
      bottom:-1000px;
      right:60%;
      margin:0px 0px 0px -182px;
      width:310px;
      height:auto;
      padding:16px;
       -webkit-box-shadow: 0px 0px 7px #222;
      -moz-box-shadow: 0px 0px 7px #222;
      box-shadow: 0px 0px 7px #222;  background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
      color:#111;
    -webkit-border-top-left-radius: 20px;
    -webkit-border-bottom-right-radius: 20px;
    -moz-border-radius-topleft: 20px;
    -moz-border-radius-bottomright: 20px;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;}
    #kotak-facebook a.close {
      position:absolute;
      top:-10px;
      right:-10px;
      background:#333;
      font:bold 16px Arial,Sans-Serif;
      text-decoration:none;
      line-height:22px;
      width:22px;
      text-align:center;
      color:#fff;
      border:2px solid #fff;
      -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      -webkit-border-radius:10px;
      -moz-border-radius:10px;
      border-radius:10px;
      cursor:pointer;
    }
</style>
    <script type='text/javascript'>
    $(window).bind("load", function() {
         // animasikan nilai top saat halaman telah selesai dimuat
         $('#kotak-facebook').animate({bottom:"50px"}, 1000);
        // hilangkan kotak pesan saat tombol (x) di klik
         $('a.close').click(function() {
             $(this).parent().fadeOut();
         return false;
         });
    });
    </script>
    <div id='kotak-facebook'>
<p style=" margin-right:10px;  font-size:15px; color:#000000;">Bagi Jempolnya Dong , Buat<blink> Like Ini Yah !!!</blink> </p>
<!-- Mulai --!>
Disini Tempat meletakan kode Fans Pagenya.......
<!-- Selesai --!><a class='close' href='#'>&times;</a>
<p style=" float:right;  margin-right:35px;  font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://dikyandrean15a.blogspot.com">Blogger Widgets</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://vivaxsnews.blogspot.com/2012/12/cara-memasang-widget-likebox-keren.html">Blogger Tutorials</a></p>
    </div>

Nahhh Seperti itu tuh gan kodenya.. untuk yang warna biru silahkan ganti... untuk penempatan widgetnya sama kode fans pagenya. tapi  saya punya kodenya.. dan kalian tinggal Ganti Url Fans pagenya dengan Url fans page kalian.
nih dia kodenya :
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F127935407291116&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%FFFFFF&amp;stream=false&amp;header=false&amp;height=280" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:280px;" allowtransparency="false"></iframe>

Ganti yang warna biru dengan Url terakhir dari Fanspage kalian Misal https://www.facebook.com/127935407291116 , url yang biru yang di taruh.. di situ. Taruh kode ini ke bagian yang tadi itu.... dari pada repot....


nah bagaimana ? keren toh !
sekian trick dari saya semoga bermanfaat , dan saya bertrima kasih kepada bang ARIFLAW
karena saya dapet trick ini dari dia .
terima kasih bang :-)

0 comments:

Post a Comment

 
Modified by analisa saham from Blogger Templates, Bibir SEO Sponsors: WooThemes Coupon Code, Rockable Press Discount Code