If you are a website owner and you want to make money from your blogger website then you need to install anti AdBlock script in Blogger website. Because nowadays most of the people use ad blocker. So they will not be able to see the ads of your blogger website because of this and you will not earn any money from it.
What is an ad blocker?
Ad Blocker is software or script that blocks ads from websites and apps. This is a way for users to opt out of ads and improve their internet experience. Ad blockers work in different ways. Some ad blockers prevent ads from loading, while others prevent ads from appearing on the page. Some ad blockers block ads completely, while others only block certain types of ads.
What are anti-ad blockers?
Anti Ad Blocker is software or script that blocks ad blockers. It is a way for website and app owners to force users to show their ads. Anti-ad blockers work in different ways. Some anti-ad blockers prevent binding to ad blockers. Some anti-ad blockers can even remove ad blockers entirely.
How do I install anti AdBlock script in Blogger?
Before we start, be sure to take backup blogger theme. If you want to use the latest anti ad blocker in blogger website then follow these steps below:
- Step 1: Log in to Blogger
Go to theme section from your blogger dashboard and select “Edit Html” from there.
- Step 2: Add anti blocker css
Search for </b:skin> by clicking Ctrl+F and paste the following codes before </b:skin>.
/* Pop-Up Box by Fineshop */
.popSc{position:fixed;top:0;bottom:0;left:0;right:0;padding:20px;background:rgba(255, 255, 255, 0.1);z-index:99980;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;justify-content:center;align-items:center}
.popSc.hidden{display:none}
.popSc .popBo{position:relative;background:rgba(255, 255, 255, 0.8);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:400px;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:30px;border-radius:20px;box-shadow:0 5px 25px rgb(0 0 0 / 20%)}
.popSc .popBo svg{display:block;width:50px;height:50px;fill:none !important;stroke:#08102b;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}
.popSc .popBo h2{margin:10px 0 15px 0;font-size:1.2rem;font-weight:800;color:#08102b}
.popSc .popBo p{margin:0;line-height:1.7em;font-size:0.9rem;color:#08102b}
.popSc .popBo .popBtn{display:inline-flex;justify-content:center;align-items:center;height:50px;width:50px;outline:none;border:none;background:#482dff;border-radius:50%;margin-top:20px;transition:all .2s ease;-webkit-transition:all .2s ease}
.popSc .popBo .popBtn:hover{transform:scale(1.05);-webkit-transform:scale(1.05)}
.popSc .popBo .popBtn svg{width:24px;height:24px;stroke:#fff;flex-shrink:0}
.popSc .popBo .popBtn svg.r{animation:rotateIcn 1.5s infinite linear;-webkit-animation:rotateIcn 1.5s infinite linear}
.popSc{animation:popupBlur .3s ease-in; -webkit-animation:popupBlur .3s}
.popSc >*{animation:popupScale .3s ease-in; -webkit-animation:popupScale .3s}
.darkMode .popSc{background:rgba(0, 0, 0, 0.1)}
.darkMode .popSc .popBo{background:rgba(50, 50, 50, 0.8)}
.darkMode .popSc .popBo svg{stroke:#fefefe}
.darkMode .popSc .popBo p, .darkMode .popSc .popBo h2{color:#fefefe}
@keyframes popupBlur {from{opacity:0}to{opacity:1}}
@-webkit-keyframes popupBlur{from{opacity:0}to{opacity:1}}
@keyframes popupScale{from{transform:scale(0);animation-timing-function:ease-in;opacity:0}to{transform:scale(1);opacity:1}}
@-webkit-keyframes popupScale{from{-webkit-transform:scale(0);-webkit-animation-timing-function: ease-in;opacity:0}to{-webkit-transform:scale(1);opacity:1}}
@keyframes rotateIcn{from{transform:rotate(0deg)} to{transform:rotate(359deg)}}
@-webkit-keyframes rotateIcn{from{-webkit-transform:rotate(0deg)} to{-webkit-transform:rotate(359deg)}}Code language: CSS (css)- Step 3: Add Anti Block Script
Then search again in blogger theme by writing </head> and paste the following codes on </head>.
<script>/*<
*/
(function(){const n=document,o=n.head;var t="pointer-events: none; height: 1px; width: 0; opacity: 0; visibility: hidden; position: fixed; bottom: 0;";const a=n.createElement("div"),s=n.createElement("div"),d=n.createElement("ins");a.id="div-gpt-ad-3061307416813-0",a.style=t,s.className="textads banner-ads banner_ads ad-unit ad-zone ad-space adsbox ads",s.style=t,d.className="adsbygoogle",d.style="display: none;";const i={allowed:null,elements:[a,s,d]};this.checkAdsStatus=function(t){const e=n.body;"function"==typeof t&&("boolean"==typeof i.allowed?t(i):(e.appendChild(a),e.appendChild(s),e.appendChild(d),setTimeout(function(){if(0===a.offsetHeight||0===s.offsetHeight||d.firstElementChild)i.allowed=!1,t(i);else{const e=n.createElement("script");e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js",e.async=!0,e.crossOrigin="anonymous",e.onload=function(){i.allowed=!0,t(i)},e.onerror=function(){i.allowed=!1,t(i)},o.appendChild(e)}a.remove(),s.remove(),d.remove()},40)))}}).call(this);
function antiAdBlockerHandler() {
window.checkAdsStatus(function(ads) {
if (!ads.allowed) {
// Ads are Blocked
console.log("%c[ADS]", "color:#d32f2f;", "Blocked");
const icon = "<svg style='stroke:none;fill:currentColor!important' viewBox='0 0 24 24'><path d='M12.2 9L10.2 7H13C14.1 7 15 7.9 15 9V11.8L13 9.8V9H12.2M23 9V7H19C17.9 7 17 7.9 17 9V11C17 12.1 17.9 13 19 13H21V15H18.2L20.2 17H21C22.1 17 23 16.1 23 15V13C23 11.9 22.1 11 21 11H19V9H23M22.1 21.5L20.8 22.8L14.4 16.4C14.1 16.7 13.6 17 13 17H9V10.9L7 8.9V17H5V13H3V17H1V9C1 7.9 1.9 7 3 7H5.1L1.1 3L2.4 1.7L22.1 21.5M5 9H3V11H5V9M13 14.9L11 12.9V15H13V14.9Z'/></svg>";
const title = "Ad blocker detected!";
const message = "<p>We have detected that you are using adblocking plugin in your browser.<br/>The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.</p>";
// Lets create the popup
const element = document.createElement("div");
element.className = "popSc";
element.innerHTML = "<div class='popBo'>" + icon + "<h2>" + title + "</h2><div class='popCo'>" + message + "</div></div>"
document.body.appendChild(element);
} else {
// Ads are allowed;
console.log("%c[ADS]", "color:#43a047;", "Allowed");
}
});
document.removeEventListener("DOMContentLoaded", antiAdBlockerHandler);
};
if (document.readyState === "complete" || document.readyState !== "loading") {
antiAdBlockerHandler();
} else {
document.addEventListener("DOMContentLoaded", antiAdBlockerHandler);
}
/*]]>*/</script>
Code language: HTML, XML (xml)- Step 4:
Now Save blogger theme. And open blogger site with an ad blocker and you will see that you’ve got yourself a beautiful stylish notification of an anti ad blocker.
Customize: If you want, you can write your own text on the marked area.
This way with bytes vibe guideline you can add powerful Anti Adblock script for Blogger. if you add an anti adblock script to blogger, the users won’t be able to see any of your blogger posts until they turn off ad blocker tool. As a result, they will refrain from using ad blockers and you can earn more money from your website’s ads. If there is any problem, please comment them below.
credit – https://www.fineshopdesign.com
