Add Floating Adsense Right And LeftSidebar In Blogger

How to Implement Floating Adsense in Blogger for Right and Left Sidebar 

Learn how to incorporate 120px x 600px AdSense ads or any other affiliate ads that can float on the right or left side of your Blogger blog. 

However, before applying this floating ads technique, make sure to carefully read the Terms of Service of your respective affiliate ads network.

Here's a step-by-step guide on adding floating Adsense and affiliate ads to the right or left sidebar in Blogger:

Step 1: Log in to your Blogger account and navigate to the Blogger Dashboard. 

 

Step 2: Go to the "Layout" section. 

 

Step 3: Click on "Add a Gadget" and select "HTML/JavaScript". 

 

Step 4: Copy the code provided below and paste it into the "HTML/JavaScript" gadget.

 

 <style>
#flotads {
  height: 30px;
  width: auto;
  background: #333333 url('..');
  background-repeat: repeat-x;
  text-align: left;
  padding-top: 4px;
}

#adsbase {
  height: 600px;
  margin: 0 auto;
  width: 120px;
  background: #fff;
  border-bottom: 2px #333333 solid;
  border-right: 2px #333333 solid;
  border-left: 2px #333333 solid;
  text-align: center;
  padding: 4px;
}

#headline {
  opacity: 1.0;
  height: auto;
  width: auto;
  position: fixed;
  top: 65px;
  left: 10px;
  border-bottom: 1px #005094 solid;
  color: #333;
  padding: 0px;
  z-index: 1001;
  font-size: 13px;
}
</style>

<script type="text/javascript">
function getValue() {
  document.getElementById("headline").style.display = 'none';
}
</script>

<div id="headline">
  <div id="flotads">
    <span style="color: #fff; font-size: 13px; font-weight: bold; text-shadow: black 0.1em 0.1em 0.1em;"></span>
    <span style="color: #fff; font-size: 13px; font-weight: bold; text-shadow: black 0.1em 0.1em 0.1em; float: right; padding-top: 3px; padding-right: 10px;">
      <a href="https://bhavanaonlineservices.blogspot.com/" target="_blank" onclick="getValue()">close(x)</a>
    </span>
  </div>
  <div id="adsbase">
    <h3></h3>
    <p align="left"><h3></h3></p>
    <p>
      
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9422781151717084"
     crossorigin="anonymous"></script>
<!-- 120*600 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:120px;height:600px"
     data-ad-client="ca-pub-9422781151717084"
     data-ad-slot="6488920835"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
      <br/>
    </p>
  </div>
</div>


Customization:

  • Replace "Adsense Code here" with your Adsense ad code or any other affiliate ads code.
  • To change the width of the ad space, modify the value of "width" in the CSS code (e.g., replace "120px" with your desired width).
  • To change the ads' floating position, modify the value of "float" in the CSS code (e.g., replace "left" with "right" for right-aligned floating).

Note: This widget is compatible with all advertising affiliate networks. However, please refrain from using this technique with Google AdSense as it violates AdSense's terms and conditions. If you choose to use this widget/gadget and receive penalties from AdSense, I hold no liability for it.

 

Next Post Previous Post