Tuesday, 20 November 2012

Membuat Kotak Iklan Melayang Dan Berpindah Di Blogger

Nah blogger indonesia ketemu lagi sama ane, pada kesempatan kali ini ane akan membagi sedikit tentang iklan melayang nih, tau kan iklan melayang.
iklan melayang itu adalah iklan yang biasanya kita lihat tidak bergerak walaupun kita menggeser web/blog keatas kebawah kekiri dan kekanan, iklannya tetap disitu situ aja.
Mau tau cara membuatnya?
  1. Login dulu ke blogger ente.
  2. Pergi ke Tata Letak.
  3. Tambah Gadget.
  4. Cari HTML/JavaScript.
  5. Copy kode dibawah ini.
  6. Tulisan yang berwarna merah untuk mengatur posisi, posisi deafult berada 10 piksel dari atas, jika ingin mencoba ganti aja yang penting jangan lupa px nya, jika ingin dibawah ganti top menjadi bottom, jika ingin dikiri tambahkan " left:2px; " dikanan " right:2px; " di bawah top.
  7. position:fixed; ganti dengan position:center;  jika ingin ditengah.


    <style type="text/css">
    #gb{
    position:fixed;
    top:10px;

    z-index:+1000;
    }
    * html #gb{position:relative;}


    .gbcontent{
    float:right;
    border:2px solid #A5BD51;
    background:#ffffff;
    padding:10px;
    }
    </style>

    <script type="text/javascript">
    function showHideGB(){
    var gb = document.getElementById("gb");
    var w = gb.offsetWidth;
    gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
    gb.opened = !gb.opened;
    }
    function moveGB(x0, xf){
    var gb = document.getElementById("gb");
    var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
    var dir = xf>x0 ? 1 : -1;
    var x = x0 + dx * dir;
    gb.style.top = x.toString() + "px";
    if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
    }
    </script>

    <div id="gb">

    <div class="gbtab" onclick="showHideGB()"> </div>

    <div class="gbcontent">

    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    .:[Close][Klik 2x]:.
    </a>
    </div>
    <center>

    Masukkin yang ente inginkan disini | iklan | gambar | video

    </center>

    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.center = (30-gb.offsetWidth).toString() + "px";
    </script></center></div></div>
  8. Masukkan kode diatas kedalam HTML/JavaScript tadi.
  9. Ganti tulisan yang berwarna oranye dengan terserah ente deh, mau masukin script iklan bisa, masukin tulisan ente bisa, gambar, video atau apalah yang ente ingin muncul disitu.
  10. Simpan dan lihat hasilnya - pratinjau hasil klik disini
buat iklan melayang | iklan melayang di blog | iklan melayang di header | iklan melayang bergerak

ads

Ditulis Oleh : boboy harisandi Hari: Tuesday, November 20, 2012 Kategori:

1 comments:

  1. wah keren tuh... tapi apa gak mengganggu pengunjung blog kita tuh gan? :)

    ReplyDelete