Cara Membuat Kotak Iklan Pop Up Melayang Dengan Mudah

 Cara Membuat Kotak Iklan Pop Up Melayang Dengan Mudah

Sebagian sobat blogger pasti sudah mencari kesana kemari artikel tentang bagaimana sih cara membuat kotak iklan melayang seperti di web duniamu38.com? jangan khawatir caranya sangat mudah dan cepat untuk di praktekkan. Jadicara Membuat Kotak Iklan Pop Up Melayang di website blogger maupun wordpress itu sangat mudah sekali hanya cukup pasang copy paste script yang sudah saya sediakan dibawah. Dan tampilannnya akan seperti ini :

Seperti yang sudah saya praktekkan di beberapa blog saya ini merupakan suatu yang cocok dan menarik bagi para visitor dan pegunjung blog saya, seperti ucapan selamat datang bisa juga berupa video, dan foto untuk dipasang pada blog kita sesuai keinginan kita.

Adapun tujuan dari kotak iklan pop up melayang sendiri yaitu untuk memberitahukan kepada para visitor atau pengunjung website kita agar para pengunjung akan tahu tentang apa yang sedang kita iklankan atau sponsorkan pada saat ini. Selain itu juga fungsinya yaitu untuk menyapa para pengunjung yang sudah mampir ke web kita, disini kita juga bisaa meletakkan sesuatu hal penting seperti pemberitahuan dalam bentuk teks penting, gambar maupun iklan lainnya yang bisa disesuaikan keinginan kita, biasanya ini tempatnya disebut dengan “Widget”.

Sebetulnya script kotak iklan melayang ini sudah banyak juga digunakan oleh para blogger diseluruh dunia khsusunya di website duniamu38.com ini, jadi script ini sangat simple dan tidak memberatkan juga pada web blog sobat, karena scriptnya sangat sederhana tapi mempunyai manfaat yang besar baut website sobat.

Okeh itu sedikit prolog dari saya mengenai Cara Memasang Kotak Iklan Melayang atau Pop Up di blogger.

Begini Caranya Membuat Kotak Iklan Pop Up Melayang di Web Blogger

Pastinya anda sudah mempunyai akun web blogger dan ikuti tutorial atau step by step dibawah ini dengan teliti, dan kalian juga bisa sesuaikan sesuai kebutuhan sobat, beginilah cara pemasangannya :

1. Login ke Blogger

2. Pilih Tata Letak

3. Klik Tambah Gadget (Pilih letaknya dimana saja terserah sobat, tampilan akan tetap melayang)

4. Pilih HTML/JAVASCRIPT

5. Copy dan Pastekan Kode Script dibawah ini : atau bisa Donwload disini 

<style type="text/css">

#topbar{

position:absolute;

padding-left:0%;padding-top:0%;

background-color: #fff;

width: 250px;heigth:180px;

visibility: hidden;

z-index: 100;

}

</style> <script type="text/javascript">

var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session

var startX = 30 //set x offset of bar in pixels

var startY = 5 //set y offset of bar in pixels

var verticalpos="fromtop" //enter "fromtop" or "frombottom"

function iecompattest(){

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body

}

function get_cookie(Name) {

var search = Name + "="

var returnvalue = "";

if (document.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) {

offset += search.length

end = document.cookie.indexOf(";", offset);

if (end == -1) end = document.cookie.length;

returnvalue=unescape(document.cookie.substring(offset, end))

}

}

return returnvalue;

}

function closebar(){

if (persistclose)

document.cookie="remainclosed=1"

document.getElementById("topbar").style.visibility="hidden"

}

function staticbar(){

barheight=document.getElementById("topbar").offsetHeight

var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;

var d = document;

function ml(id){

var el=d.getElementById(id);

if (!persistclose || persistclose && get_cookie("remainclosed")=="")

el.style.visibility="visible"

if(d.layers)el.style=el;

el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};

el.x = startX;

if (verticalpos=="fromtop")

el.y = startY;

else{

el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;

el.y -= startY;

}

return el;

}

window.stayTopLeft=function(){

if (verticalpos=="fromtop"){

var pY = ns ? pageYOffset : iecompattest().scrollTop;

ftlObj.y += (pY + startY - ftlObj.y)/8;

}

else{

var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;

ftlObj.y += (pY - startY - ftlObj.y)/8;

}

ftlObj.sP(ftlObj.x, ftlObj.y);

setTimeout("stayTopLeft()", 5);

}

ftlObj = ml("topbar");

stayTopLeft();

}

if (window.addEventListener)

window.addEventListener("load", staticbar, false)

else if (window.attachEvent)

window.attachEvent("onload", staticbar)

else if (document.getElementById)

window.onload=staticbar

</script>

<div class="clear">

</div>

<div id="topbar">

<div style="text-align: right;">

<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhR3Y-5C1KAeUfdnIUkfWrpl6q02beLFz94flDe_1G91t7tdsWsVJVkmv_tg7K-llP5A03B7LeRZDNaI_7preTkQo73CgteWyFSIIJobvNuONcoa7wWVWixMYou-L5Xtze7h_oaA4sI_Hk/s1600/close2-24.png" alt="close"/></a>

<br/><center><b>Klik 2x untuk menutup(x)</b></center><center>Selamat Datang Di Website Resmi www.duniamu38.com</center><br/>

</div>

<div style="background: #fff;">

</div></div>

6. Pilih Simpan

Demikian tutorial Cara Memasang Iklan Pop Up/ Melayang di Blogger semoga bermanfaat dan selamat mencoba semoga berhasil. Terimakasih.