Pasang dan Buat Iklan Melayang Responsive Simple di Blog


Pasang dan Buat Iklan Melayang Responsive Simple di Blog. Cara Pasang Iklan Melayang (Floating Ads) di blog. Cara ini biasanya bertujuan untuk meningkatkan klik pada blog, sehingga penghasilan dari blog tersebut bisa meningkat tajam.

Untuk pembuatan script untuk iklan melayang di blog ini sangat simple dan juga sederhana, karena hanya menggunakan sedikit javascript. Dan ini juga tidak menggunakan Jquery Library. Sehingga iklan tidak mengganggu loading blog.

Biasanya untuk jenis iklan yang besar contoh Iklan Baner, yang lebarnya 728px dan juga 970px tampilannya akan terpotong jika dipasang di ponsel. Oleh karena ini untuk tutorial kali ini akan ditambahkan beberapa sentuhan CSS supaya iklan baner tersebut menjadi responsive di semua device.

Oke langsung saja jika kalian penasaran bagaimana cara memasangnya simak tutorial di bawah ini.

Cara Pasang Iklan Melayang (Floating Ads) di Blog.

  1. Silakan kalian Login ke Blogger, Kemudian Masuk ke TEMA kemudian klik EDIT HTML.
  2. Lalu Cari (CRTL + F) kode </body>. Letakkan kode dibawah ini di ATAS kode </body>.
    
    <script type='text/javascript'>
    $(document).ready(function() {$(&#39;img#closed&#39;).click(function(){$(&#39;#btm_banner&#39;).hide(90);});});
    </script>
    <!--start: floating ads-->
    <div id='floatads' style='width:100%;margin:auto; text-align:center;float:none;overflow:hidden; display:scroll;position:fixed; bottom:0;z-index:9999'>
    <div><a id='close-floatads' onclick='document.getElementById(&apos;floatads&apos;).style.display = &apos;none&apos;;' style='cursor:pointer;'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ-XSQ9br8MVDQDTkpTJkU89vfrPnmJRpKs5P-AOyGF-hJWoUQz1EX7jZskDO2Jig2NxqFUnIDNnXgswPRrqOYs_KVMiAB4olNAJfj3yRwtfjysY7uX30Uh7It_0gIBA88ESEdQs1CdWU/s1600/btn_close.gif' title='close button'/></a></div>
    <div style='text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto'>
    <!-- Awal Script iklan-->
    <!-- LETAKAN IKLAN DISINI 728x90 -->
    <!--Akhir script iklan-->
    </div>
     </div><!--end: floating ads-->
    
  3. Lalu untuk kode max-width:728px, itu adalah lebar baner. Jika kalian ingin memasang iklan lebih dari itu misalnya 970px, maka ubah saja mx-width:720px menjadi max-width:970px. Namun jika lebar iklan dibawah 720px, tidak perlu merubah kode ukuran tersebut.
  4. Untuk kode <! – LETAKAN IKLAN DISINI 728x90 --> Silakan HAPUS kode tersebut, Lalu ganti dengan kode iklan kalian.
  5. Kemudian Klik Simpan Tema. Untuk melihat hasilnya silakan buka blog kalian.

Itulah Sedikit Cara untuk memasang iklan melayang di Blogger. Semoga dapat bermanfaat. Sekian dan terima kasih.

Pasang dan Buat Iklan Melayang Responsive Simple di Blog
Wahyu Achmad
Penulis biasa

Postingan Terkait

2 komentar

Posting Komentar