Si eres propietario de un sitio web, es posible que confíes de alguna manera en la publicidad para pagar tus cuentas de hosting. Y si tienes la suerte de contar con más de un par de personas que visiten tu sitio asiduamente, incluso podrías ser capaz de pagar un suplemento a tu salario como compensación por el trabajo duro.
En la otra parte están las personas que navegan. Están cansados de ser bombardeados con publicidad intrusiva, banners llamativos y anuncios que arruinan la experiencia de navegación. Ellos no tienen que por qué ser felicitados por ser el visitante un millón de tu sitio web, no quieren entrar en el sorteo de cinco iphones, lo único que quieren es acceder a tu contenido.
Como es mucho más fácil para los usuarios ocultar anuncios, que desarrollar un ética publicitaria en toda la industria, surgió rápidamente una solución simple
Los temidos AdBlockers
Los AdBlockers son extensiones para navegador que bloquean o eliminan la publicidad de una página. Una "solución" no es el término adecuado, ya que sólo sirve para una parte, los usuarios. Estas extensiones eliminan todo excepto el contenido principal de la página, con lo que se le da una nueva dimensión a la palabra libre: no sólo significa que no pagan, ahora significa que no se les paga también.
Al principio no era un gran problema ya que pocos los utilizaban y sabían de su existencia. De aquí a unos pocos años, se pusieron de moda las extensiones para navegador, fueron todo un boom. Por lo que también proliferaron los bloqueadores de anuncios. Si te das una vuelta rápida por los principales repositorios de extensiones para navegador verás que los bloqueadores de anuncios son la categoría más popular. Claro está, los sitios pequeños están en mayor riesgo, ya que no pueden atraer el mismo interés de los anunciantes y no pueden experimentar con diferentes formatos.
Por suerte, el bloqueador de anuncios más popular, AdBlock Plus, permite la publicidad aceptable por defecto. A juzgar por el revuelo que suscitó esta decisión, mucha gente restringió aún más los parámetros de Adblock Plus, mientras que otros cambiaron de extensión. Esto significa que nosotros, como autores, aún tenemos que gestionar este problema durante mucho más tiempo. Una solución sencilla es detectar la presencia de un bloqueador de anuncios, y este es el propósito de este artículo.
Cómo detectar AdBlock
Es simple, para bloquear anuncios dicha extensión busca los archivos que cree que contienen códigos para mostrar publicidad y evitan que se carguen. Así que la idea es tener un archivo JS llamado advertisement.js, lo que llamará la atención de AdBlock, después de esto, comprobaremos si el archivo se ha cargado.
Aquí tenemos el archivo:
assets/blockBlock/advertisement.js
jQuery.adblock = false;
Eso es todo, una línea. Se crea una nueva propiedad en el objeto global de jQuery, que vamos a utilizar más adelante. Si no está definido, significaría que este archivo ha sido bloqueado.
assets/blockBlock/blockBlock.jquery.js
(function($){
if ($.adblock === undefined){
$.adblock = true;
}
$.fn.showOnAdBlock = function(){
if($.adblock){
this.show();
}
return this;
};
})(jQuery);
Para averiguar si hay un bloqueador de publicidad presente, sólo tienes que comprobar la variable $.adblock. En el mismo archivo, también definimos un método de ayuda que mostrará un elemento dependiendo de si dicha ampliación está activa.
Al incluir este plugin en tu sitio web, recuerda incluir los archivos de arriba después de la librería jQuery. Para la página de demostración también estoy utilizando el confirm dialog replacement para mostrar un cuadro de diálogo cuyo objetivo es informar a los usuarios que deben desactivar Adblock para ver la página. Este es el código para ello:
assets/js/script.js
$(function(){
if($.adblock){
$.confirm({
'title' : 'Adblocker active!',
'message' : 'You are running an ..',
'buttons' : {
'I will!' : {
'class' : 'blue',
'action': function(){
// Do nothing
return;
}
},
'Never!' : {
'class' : 'gray',
'action': function(){
// Redirect to some page
window.location = 'http://programacion.net/';
}
}
}
});
}
});
¡Bang! Ahora puedes decir que estás bloqueando a un bloqueador de anuncios. Este sencillo método funciona con la mayoría de los plugins que bloquean anuncios utilizados en la actualidad.