How to add floating sticky top ads script for blogger
Hi Dude, Welcome to our Pixabin official blog. today I show how to set up Floating Sticky Anchor Ads on Top in blogger Website.
This Floating sticky top ads script was provided google user Experiance for Your blog Visiters.
How to Setup this Anchor Ads on top in blogger step by step
- Go to your blogger Dashboard and go to theme Section.
- Now click Drop down Menu and Click "Edit HTML" Option.
- Click Ctrl+F and Find ]]></b:skin> Tag on your blogger Theme.
- Next, copy the Below CSS Script and Paste Above on ]]></b:skin> Tag.
.Pixabin-top-ads { position: fixed; top: 0; left: 0; width: 100%; min-height: 70px; max-height: 200px; padding: 5px 0; box-shadow: 0 -6px 18px 0 rgba(9,32,76,.1); -webkit-transition: all .1s ease-in; transition: all .1s ease-in; display: flex; align-items: center; justify-content: center; background-color: #fefefe; z-index: 20; }
.Pixabin-top-ads-close { width: 30px;
height: 30px; display: flex;
align-items: center;
justify-content: center;
border-radius: 0 0 12px;
position: absolute; left: 0; bottom: -30px;
background-color: #fefefe; box-shadow: 0 -0px 18px 0 rgba(9,32,76,.08); }
.Pixabin-top-ads .Pixabin-top-ads-close svg { width: 22px; height: 22px; fill: #000; }
.Pixabin-top-ads .Pixabin-top-ads-content { overflow: hidden;
display: block;
position: relative;
height: 70px;
width: 100%;
margin-right: 10px;
margin-left: 10px; }
- Next, Again Click the Ctrl+F and Find </body> Tag on your Theme
- Copy the below HTML Script and Javascript.
<div class='Pixabin-top-ads jhfdiuh0' id='Pixabin-top-ads'>
<div class='Pixabin-top-ads-close' onclick='document.getElementById("Pixabin-top-ads").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='Pixabin-top-ads-content'>
<ins class="adsbygoogle"
style="display:inline-block;height:70px;width:100%;line-height:70px;"
data-ad-client="ca-pub-0000000000000000"
data-ad-slot="0000000000"></ins><script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
- Paste the Html script above on </body> Tag
- Do not forgot save your Template.
Custom Modifications
- 0000000000000000 - Replace your Adsence Publisher ID
- 0000000000 - Replace your Adsence Ads Solt ID
Video Guide
Final Word
We are hope this script is helps to make perfect Anchor ads on top on the
blogger Website. if you want to more information like this please follow our
Blog on Youtube, telegram and Google News.