En este artículo veremos cómo bloquear adblock en nuestro sitio web, usaremos symfony framework la biblioteca SweetAlert2 para crear elegantes alertas, primero comenzaremos de un script que este amigo nos comparte en su blog
¿Cómo bloquear Adblock en mi sitio web?
Muchas personas se ganan la vida con sus proyectos web, ya sea un blog, enlaces de referencia, etc., el uso de Adblock limita la presencia de anuncios en nuestro sitio web, con el uso de Google AdSense .
Primero partimos del script base del amigo, el cual genera una alerta genérica al detectar el bloqueador, lo que haremos es crear una alerta con la cual el usuario no podrá quitar la alerta al hacer clic, hasta desactivar el bloqueador .
// we will create a new function, upon detecting the blocker
modalBlock();
Hasta ahora lo que hemos hecho es agregar una nueva función llamada modalBlock () , ahora procedemos con la carga de las bibliotecas jquery y sweetalert con el uso de su cdn.
¿Cómo usar sweetalert 2?
Luego llamaremos a la función modalBlock () , recuerde abrir y cerrar la etiqueta del script, usaremos la función swal () que en su interior tiene propiedades como icon , título, etc., usaremos la propiedad button como falsa para que no aparezca un botón y aquí lo importante es la propiedad closeOnClickOutside , para que al hacer clic fuera el modal no se cierra.
async function modalBlock()
{
swal({
icon: "warning",
title: 'Este sitio muestra anuncios',
text: 'DeshabilitarAdBlock',
type: 'warning',
showCancelButton: false,
showConfirmButton: false,
button: false,
closeOnClickOutside: false
}).then(function() {
console.log("Algun mensaje de success,opcional");
}, function(err) {
console.log("Algun mensaje de error" + err);
});
}
Resultado cuando tenemos el bloqueador de anuncios activado.
Resultado cuando inhabilitas adblock.