no-style

close

How to Make fixed floating AdSense AD Widget

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 longer and it will not affect your website speed any other thing.

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

I don't know that does AdSense allows 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 copy 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>
  5. To search anything in blogger template section press Ctrl+F and then type term to search and press enter.
  6. Now copy the code provided below and add it after </body> tag.
  7. <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://1.bp.blogspot.com/-_A83iDM6JYc/VhtxROLILrI/AAAAAAAADK4/aM4ikIA6aqI/s1600/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>
  8. Save Theme/Template

Conclusion:

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

2 Comments

Was this article useful? Please Leave Your Feedback by writing what's in your mind, below.
  1. Amigo, como lo hago para ponerlo en los lados, ya sea izquierdo o derecho

    ReplyDelete
  2. Espere el próximo artículo, compartiré el método para mostrar AD en ambos lados.

    Gracias por tus comentarios.

    ReplyDelete

Post a Comment

Was this article useful? Please Leave Your Feedback by writing what's in your mind, below.

no-style

no-style

Recent Comments

{getWidget} $results={3} $label={comments} $type={list}