Cara Memasang Kotak Slide Pada Blog

Cara Memasang Kotak Slide Pada Blog 

NewBie- Cara Memasang Kotak Slide Pada Blog 

Selamat pagi Sobat Pada kesempatan Kali ini Saya akan berbagi Tutorial Blog Yaitu Cara Memasang Kotak Slide Pada Blog Ala Opick Weblog ,Slide Box Atau Kotak Slide Ini Sangat Ringan Anda Bisa Memasang Widget Atau Tulisan Pada Slide Box Ini Widget Ini Akan Muncul ketika Blog selesai Dimuat atau Loading Blog Sudah selelai 

Jika Ingin mencoba Slide Box Ini Silahkan Ikuti Tutorial berikut ini..

Silahkan Copy Code Widget Dibawah ini dan Paste Di HTML/JavaScript Pada Tata letak Blog

<style>
#box-opickweblog{position:fixed!important;position:absolute;/* IE6 */
  top:70px;z-index:999;right:-1000px;width:300px;margin:0 0 0 -182px;height:auto;font:normal 12px Arial,Sans-Serif;padding:8px 10px 20px 10px;background-color:#fff;line-height:1em;-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4);-moz-box-shadow:0 1px 3px rgba(0,0,0,.4);box-shadow:0 1px 3px rgba(0,0,0,.4)}
#box-opickweblog a.close{position:absolute;bottom:0;left:0;background-color:transparant;font:normal bold 20px Arial,Sans-Serif;text-decoration:none;line-height:22px;width:22px;text-align:center;color:#444;transform:rotate(0);cursor:pointer}
#box-opickweblog a.close:hover{transform:rotate(360deg);color:#efb16f;}
#box-opickweblog a.get-widget{position:absolute;bottom:2px;right:2px;font-size:11px;color:#c8c8c8;cursor:pointer}
#box-opickweblog a.get-widget:hover{color:#444;}
</style>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js'></script>
<script type='text/javascript'>
$(window).bind("load", function() {

    // animasikan nilai top saat halaman telah selesai dimuat
    $('#box-opickweblog').animate({right:"5px"}, 1000);

    // hilangkan kotak pesan saat tombol (x) diklik
    $('a.close').click(function() {
        $(this).parent().fadeOut();
        return false;
    });

});
</script>
<div id='box-opickweblog'>

ISI DENGAN KONTENT/WIDGET YANG ANDA INGINKAN.

    <a class='get-widget' href='http://goo.gl/KdnmpQ' target='_blank' title='Get This Widget'>get widget</a>
    <a class='close' href='#'>&times;</a>
</div>

Keterangan:
1.  Pada Bagian bawah <div id='box-opickweblog'> Ganti Tulisa "ISI DENGAN KONTENT/WIDGET YANG ANDA INGINKAN." Sesuai yang anda inginkan ,Anda BIsa mengisinya dengan Kata-kata atau dengan Widget Like Box .dll
 2. Anda Juga Bisa merubah / Mengatur lebar Kotak Slide dengan Mengganti width:300px; Juga Bisa Menggubahnya Menjadi width:auto; Untuk Mode Otomatis

Sekian Cara Memasang Kotak Slide Pada Blog Semoga bermanfaat

Source : http://wajahilmu.blogspot.sg/2015/06/cara-memasang-simple-slide-box-pada-blog.html

Artikel Terkait

Cara Memasang Kotak Slide Pada Blog

4/ 5

Oleh Teknokrat

Teknokrat 7:07 PM 14 Komentar