How to Make fixed floating AdSense AD Widget

Making fixed floating AdSense AD is the main aim of this today's article I hope you will like this article.

As you can see fixed floating AdSense ad on my website and today in this article I am going to tell you how you can make this kind of floating AdSense ad in your website.

For this we are going to use HTML, CSS and JavaScript. The source code of this widget is not too much lengthy and it will not affect your website speed any other thing.

I am just writing this article because one of my friend asked me how we can create and add this kind of fixed floating AdSense ad in website.

I don't know that does AdSense allow it or not but I have seen on many websites using this technique.

So below are the steps that we have to follow to add this widget in blogger but if you are a wordpress user then you can simply copies source code provided below and paste it into the index.php file of your wordpress code editor.

Steps To Follow:

1. Go to Blogger Dashboard
2. Go to Theme/Template Section
3. Click Edit HTML
4. Now Search for </body>

To search anything in blogger template section press Ctrl+F and then type term to search and press enter.

5. Now copy the code provided below and add it after </body> tag.

<script type='text/javascript'>
$(document).ready(function() {$('img#closed').click(function(){$('#bl_banner').hide(90);});});
</script>
<div id='fixedban' style='width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:999;-webkit-transform:translateZ(0);'>
<div><a id='close-fixedban' onclick='document.getElementById("fixedban").style.display = "none";' style='cursor:pointer;'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjarVBvYDqm2jlZEHvE5cp9OlprlGa4eHUg56XHoNRI8NWMi5lOaMXG3Yk5BJdZJwQad7bKiOG-hNsO7ShhHd-y53wie5kyO-lpGY42bE3fjh5uX6lh5cy2gT9oytY2vxwcr4lkEOg2pYBr/s1600-e30/btn_close.gif' title='close button' style='vertical-align:middle;'/></a></div>
<div style='text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto'>

Paste your AdSense AD Code here

</div>
</div>

6. Save Theme/Template

Conclusion:

In this article we have learnt how we can make fixed floating AdSense ad widget in our website I hope that this article helped you alot and solved your problem.

source:softwebtuts.com