Sponsor 1
custom
codes

Add Banner Ads on the float left and right


Posted by TokoBanten Labels: , ,

custom-codes - You must have seen the ads floating / pop-up on the right or left of the blog, in addition to advertising widely used by bloggers blog because it will save space on the blog.

follow the steps below:


  1. Please Log In your blogger account. 

2. add this code above the </ body>


<script type='text/javascript'>
$(document).ready(function() {
$('img#closed').click(function(){
$('#btm_banner').hide(10);
});
});
</script>
<script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>


3. and add this code (Choose Layout ---> --- Add a Gadget > HTML / JavaScript.)


<div id="teaser2" style="width:autopx; height:autopx; text-align:left; display:scroll; position:absolute; top:60px;left:0px;">
<div>
<a href="#" id="close-teaser" onclick="document.getElementById('teaser2').style.display = 'none';" style="cursor:pointer;"><center>
<img src='images/close-l.png'/ style="margin-bottom:-75px; margin-left:-83px; position:relative; z-index:99999;"></center>
</a></div>
<span style="margin-left:10px; top:75px;">
Code Banner Ads / Adsense
</span>
</div>

<div id="teaser3" style="width:autopx; height:autopx; text-align:left; display:scroll; position:absolute; top:680px;left:0px;">
<div>
<a href="http://your-url.com" target="_blank" id="close-teaser" onclick="document.getElementById('teaser3').style.display = 'none';" style="cursor:pointer;"><center>
<img src='images/close-l.png'/ style="margin-bottom:-75px; margin-left:-83px; position:relative; z-index:99999;"></center>
</a></div>
<a href="http://your-url.com" target="_blank"><img src="images/banner-right.jpg" style="margin-left:10px; top:75px;"></img></a>
</div>

<div id="teaser4" style="width:autopx; height:autopx; text-align:right; display:scroll; position:absolute; top:60px; right:0px;">
<div>
<a href="http://your-url.com" target="_blank" id="close-teaser" onclick="document.getElementById('teaser4').style.display = 'none';" style="cursor:pointer;"><center>
<img src='images/close-r.png'/ style="margin-bottom:-75px; margin-right:-83px; position:relative; z-index:99999;"></center>
</a></div>
<a href="http://your-url.com" target="_blank" style="position:relative; z-index:1;"><img src="images/ads-right1.gif" style="margin-right:10px; top:75px;"></img></a>
</div>

<div id="teaser5" style="width:autopx; height:autopx; text-align:left; display:scroll; position:absolute; top:680px;right:0px;">
<div>
<a href="http://tokobanten.com/ads_banner-p33" target="_blank" id="close-teaser" onclick="document.getElementById('teaser5').style.display = 'none';" style="cursor:pointer;"><center>
<img src='images/close-r.png'/ style="margin-bottom:-75px; margin-right:-83px; position:relative; z-index:99999;"></center>
</a></div>
<a href="http://your-url.com" target="_blank"><img src="images/banner-right.jpg" style="margin-right:10px; top:75px;"></img></a>
</div>


this image for button closed :


this example banner (size 160px X 600px)




click This for Demo

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)