If you want to add footer responsive sticky ads in your blogger website then this article will be helpful for you. In this article, we will explain you, how you can add responsive sticky ads in your website.
A Sticky Ad is a type of ad that stays at a specific location on the user's screen. When a user visits and scrolls a page, it stays at a specific location on the page. It is also called Anchor Ad. It is generally use in the site header, footer, sidebar and others positions. But most of the blog owners use it on the bottom of their sites.
There are several benefits to use Sticky Ad in your blogger website.
If you use Google AdSense and want to add sticky ads for your blogger website, it will be violate AdSense Policies. Because, AdSense has already sticky ad which is called Anchor Ad also.
But, if you will make it proper user-friendly then it will not violate the AdSense Policy. The code that we provide is totally optimized and user-friendly. You can use this code as your wish.
Note: We aren’t recommend you to use sticky ad for your website. We share it just for Educational Purpose. To use this sticky ad code, you can generate extra revenue easily, but it will be impact on your audience as well as your site ranking. Also Google can disabled your AdSense account forever. So, make sure that you can use it at your own risk.
Let's know how you can add a footer responsible sticky ad in your blogger website and boost your ad revenue.
Step 1: Open your Blogger Dashboard and Go to the Theme section. Then click on theme arrow and again click on Edit HTML.
Step 2: Then, you have to find out </body> (Closing Body) section. Generally, you will see this section in the bottom of your theme.
Step 3: Then copy this HTML & CSS Code.
<style>
.aprozone {position: fixed; bottom: 0; left: 0; width: 100%; min-height: 70px; max-height: 200px; padding: 5px 0; -webkit-transition: all .1s ease-in; transition: all .1s ease-in; display: flex; align-items: center; justify-content: center; background-color: #ffffff; z-index: 20;}
.aprozone-close
{ width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 12px 0 0; position: absolute; right: 0; top: -30px; background-color: #ffffff;}
.aprozone .aprozone-close svg { width: 32px; height: 32px; fill: #000000;}
.aprozone .aprozone-content { overflow: hidden; display: block; position: relative;
height: 70px; width: 100%; margin-right: 10px; margin-left: 10px;}
</style>
<!-- Sticky Ad Code by AproZone -->
<div class='aprozone' id='aprozone'>
<div class='aprozone-close'
onclick='document.getElementById("aprozone").style.display="none"'><svg
viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'><path d='M278.6 256l68.2-68.2c6.2-6.2 6.2-16.4 0-22.6-6.2-6.2-16.4-6.2-22.6 0L256 233.4l-68.2-68.2c-6.2-6.2-16.4-6.2-22.6 0-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3l68.2 68.2-68.2 68.2c-3.1 3.1-4.7 7.2-4.7 11.3 0 4.1 1.6 8.2 4.7 11.3 6.2 6.2 16.4 6.2 22.6 0l68.2-68.2 68.2 68.2c6.2 6.2 16.4 6.2 22.6 0 6.2-6.2 6.2-16.4 0-22.6L278.6 256z'/></svg></div>
<div class='aprozone-content'>
<!-- Paste Your Ad Code Here -->
</div>
</div>
Step 4: After copying this code, you have to paste it above the </body> tag.
Step 5: Then, you have to paste your ad code after the <!-- Paste Your Ad Code Here --> tag. (You can also replace your ad code with those above code if you want)
Step 6: Make sure your creating ad dimensions for PC is 720×90 and for Mobile 320×50. Because this ad format is user-friendly and will great visibility for your blogger website.
Advance Tips: You can paste the HTML and CSS Code above the </body> (closing body) tag. You don’t need to paste this code specifically.
In conclusion, we hope that how you can add a footer responsible sticky ad in your blogger website and boost your earning or generate revenue then previous. We describe it very easily so that you understand it. But, If you have any doubt regarding this post, you can contact with us. We will help you as soon. Thanks to stay with this article.