Membuat Iklan Melayang

12/12/2010 Blogger Tutorial Blogger Widget
Halo sobat kang fatur semua. Dihari Minggu yang mendung sebelum saya melakukan Blogwalking ke tempat sahabat semua saya ingin meninggalkan sedikit coretan untuk para sahabat. Kali ini saya akan mengetengahkan cara membuat Iklan Melayang dengan Tombol Close 2 Kali. Walaupun postingan saya kali ini bukan suatu hal yang baru palagi bagi master-master tapi mudah-mudahan bagi yang pemula ini menjadikan suatu yang baru.

OK, sahabat semua saya tidak akan menjelaskan secara rinci tentang postingan ini karena mungkin para sobat sudah tahu, ngerti atau pernah menemukan mungkin juga melihat disahabat-sahabat lain apa itu Iklan Melayang.

Sekarang kita langsung meluncur ke tahap pemasangan OK

  1. Seperti biasa LogIn ke Blogger sobat
  2. Pergi ke Layout / Tata Letak
  3. Kemudian "Tambah Gadget" di atas Header
  4. Klik "HTML/Javascript
  5. Kemudian masukan kode di bawah ini :

    <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>

    Masukan Kode iklan atau Gambar yang Sobat ingin pasang di sini

    </center>

    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.center = (30-gb.offsetWidth).toString() + "px";
    </script></center></div></div>


  6. Klik Save/Simpan


KETERANGAN!!!
Masukan kode Iklan, gambar ataupun Widget Sobat yang lain pada bagian tulisan yang berwarna merah di atas.


Sekarang lihat hasilnya. Mudah bukan???

KOMENTAR ANDA SANGAT BERMANFAAT BAGI PERKEMBANGAN BLOG INI

Artikel Terkait

Previous
Next Post »
Penulisan markup di komentar
  • Untuk menulis huruf bold silahkan gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic silahkan gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline silahkan gunakan <u></u>.
  • Untuk menulis huruf strikethrought silahkan gunakan <strike></strike>.
  • Untuk menulis kode HTML silahkan gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silahkan parse dulu kodenya pada kotak parser di bawah ini.

Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

14 comments

salam ziarah....TQ 4 being my follower....

Balas

sob,, aku pasang link banner ku yah??
soalnya perbaikan dari blog ku yg dulu silverline studio blog...
sekrang ganti domain dan banner,,,

dan banner sobat udah aku perbaiki...

thanks...

Balas

om.. link banner om sudah saya pasang di blog saya, link banner balik ya om soalnya pas aku mau pasang sendiri di ada tulisan "You must enter a valid URL for your button.
Go back." gimana nih kak

http://yugo21.blogspot.com

please

Balas

salam kunjungan, selamat menyambut tahun baru. semoga silaturrahim yg terbina sentiasa kukuh.

Balas

iya sob, di tahun 2011 mahu maju setapak ke hadapan ngak mahu tertinggal oleh blogger newbie he..he...

Balas

mantap gan, dengan begitu potensi iklan dklik semakin besar ya gan.:D

Balas

gimana sob mahu buat posting agar kode HTML tampil di post

Balas

@Seri Bahasa Oooh gampang sob tinggal diParse aja kode HTML nya ni alamat parsenya http://www.blogcrowds.com/resources/parse_html.php disitu paste kode HTML lalu klik PARSE terus nanti ada hasil Parsenya itu yg kita pasang di Postingan

Balas

Wah... keren banget tuh tipsnya... sekeren tampilan blog ini.... Salam kenal...

Balas

kang,,di saya jalan,,tapi koq mlah jadi ancur ya?
jadi nyatu ama buku tamu melayang,,

Balas

@Fikri Blaze Mungkin bentrok SCRIPT nya sob, harus dibuang salah satu

Balas
This comment has been removed by the author.