Adblocker Not Installed warning

Based on this Detect Missing Ad-Blocker plugin for Wordpress, I pounded on a little.

Test — adblocker-test is the result. It has the following custom CSS:

  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.6);
  display: flex;
  justify-content: center;
  align-items: center;

div.ftf-dma-note-content-wrapper {
    background: #fff;
    color: #333;
    width: 50%;
    height: 50%;
    padding: 1em;
  /* this is the close label */
  .ftf-dma-close-btn {
    float: right;
    cursor: pointer;

  .ftf-dma-note.d-none {
    display: none !important;
    pointer-events: none !important;

Then within the page, I have the following html:

  class="ftf-dma-note ad native-ad native-ad-1 ytd-j yxd-j yxd-jd aff-content-col aff-inner-col aff-item-list ark-ad-message inplayer-ad inplayer_banners in_stream_banner trafficjunky-float-right dbanner preroll-blocker happy-inside-player blocker-notice blocker-overlay exo-horizontal ave-pl bottom-hor-block brs-block advboxemb wgAdBlockMessage glx-watermark-container overlay-advertising-new header-menu-bottom-ads rkads mdp-deblocker-wrapper amp-ad-inner imggif bloc-pub bloc-pub2 hor_banner aan_fake aan_fake__video-units rps_player_ads fints-block__row full-ave-pl full-bns-block vertbars video-brs player-bns-block wps-player__happy-inside gallery-bns-bl stream-item-widget adsbyrunactive happy-under-player adde_modal_detector adde_modal-overlay ninja-recommend-block aoa_overlay message"
  <div class="ftf-dma-note-content-wrapper">
    <span onclick="" id="ftf-dma-close-btn" class="ftf-dma-close-btn"
    <div class="ftf-dma-note-header">
      <p>Adblocker not detected!</p>
    <div class="ftf-dma-note-content">Consider installing a browser extension which blocks ads and other malicious content (<i><a href="">why?</a></i>):<ul>
<li><a href="">UBlock Origin</a></li>
<li><a href="">StopTheMadness</a></li>
<li><a href="">Ghostery</a></li>

There’s also custom JavaScript

const cookieNameValue = "ftf-dma-notice=shown";
const note = document.getElementById("ftf-dma-note");
const noteCloseButton = document.getElementById("ftf-dma-close-btn");

if (note !== null && noteCloseButton !== null) {
  noteCloseButton.onclick = (ev) => {
    document.cookie = cookieNameValue;

but this is only needed if you want to set a cookie so that the user who has clicked “Close” won’t have to see the warning again.

Why might you want to do this? Should I Block Ads? has an explanation.

Presented as an illustration that quite a bit of customization is available in if you get clever.


You are a freakn legend! I approve :grin:

I wont be adding this to mine (because I am lazy) but man I do love this.

1 Like

This is really cool!! Thanks for sharing, @davepolaschek!

1 Like

Matt, one of the things I’ve been wondering is if it’s possible to change the landing page for a blog (when no page is specified, for example).

I think there are a few cases where this might be a handy thing, and this warning is one of them.


1 Like

Oh yeah, that’d be great for this. There’s been some discussion around it that might help for now, here: Home Page, and an older feature request: Option to Set Pinned Page as Homepage. But I think this would be a great feature, so I would like to add an easy way to do this in the future.

Yes. That would also be a nice option for “book” blogs, letting people land on the table of contents or cover page, rather than seeing multiple pages. I’ve figured out how to force display of just a single page, but the data still gets squirted across the wire.

Anyway, I’ve got three sites now that could use that feature.

1 Like