martes, 17 de mayo de 2011

Bloquear Adblock Plus en Blogger u otros sitios con JQuery

Inicialmente no pensaba publicar este artículo, en parte porque no me parece muy adecuado que los administradores de una Web se centren en la restricción de un contenido, en vez de trabajar la calidad y la relación pro-activa con sus usuarios, pero cada vez es más común que se usen bloqueadores de publicidad, algo que se reciente cuando se depende de la publicidad para el hosting.

Este método necesita JavaScript debido a que no es un método que requiere modificaciones del lado del servidor, con todos sus inconvenientes y debilidades.

Esta es una versión publicada originalmente en modification-blog.blogspot.com derivada del modo de energía de OnlineLeaf.com con JQuery.

Instalar JQuery
Entre las tag <head> y </head> pegamos:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
Instalar segundo Script
Aclaración: En este script únicamente edite las partes en color, he puesto una imagen que puede reeemplazar o eliminar por una propia, si quiere que la imagen se muestre abajo del texto, solamente envuélvala entre las etiquetas <p></p>.
No use comillas ("), ni tildes ('), o acentos dentro del texto, pues por alguna extraña razón no funcionará.

Advertencia: Si quieren usarlo en un sitio que no esté en blogger, reemplace //<![CDATA[ por <!--//]]> por -->

Instalación: busque la etiqueta </body> y pegue justo antes el siguiente Script:
<script type='text/javascript'>//<![CDATA[
/*
 * jQuery Anti Adblock
 * @copyright Hendriono http://modification-blog.blogspot.com
 * @version 1.00 (9 Maret 2011)
 */
var standby = false;
var adminblog = "[ Nombre del Administrador del Sitio ]";
function CekBlok() {
if ($(".adsantilok").height() == "0") {
        TutupHalaman();
    }
}
function TutupHalaman() {
    if (!standby) {
        var h = 0;
        h = jQuery(window).height();
        jQuery("#energysaving").show().css({
            height: "0",
            width: "0",
            left: "50%",
            top: "50%"
        }).animate({
            width: "100%",
            height: h,
            left: "0",
            top: "0",
            opacity: "1"
        }, 1000);
        standby = true;
    }
}
function jAntiBlock() {
jQuery(function () {
jQuery(document).ready(function () {
setTimeout("CekBlok();", 1000);
jQuery("body").append('<div id="energysaving"><p>AD Block detectado<br /><span>Acciones necesarias. <br/>Este sitio no funciona con Adblock. Para ver este sitio es necesario no bloquear la publicidad, presiona en Adblock <b>Dont Run in sitio.blogspot.com</b><br/> la publicidad de este sitio no es intrusiva y es por ella que obtienes todo el contenido de este sitio gratuitamente. <br/>'+adminblog+'</span></p><img src="https://lh4.googleusercontent.com/_NNS6r_z4aeg/Tchw5RZKuKI/AAAAAAAAUfs/jgFoe0eEmdc/adblock.jpg"/><div id="copyrightOnlineLeaf">Copyright 2011 <font style="color: #FFD900;">Marca</font> - Derechos reservador - Tu estas en <font style="color: #FFD900;">tusitio.blogspot.com</font></div></div>');
});
});
}
jAntiBlock(); //]]>
</script>
Insertar en la sección CSS de la página:
 div#energysaving, div#energysaving *
{  -moz-border-radius: 0;
 -webkit-border-radius: 0;
 border: 0;
 background-color: #000000;
 }
 div#energysaving
{
margin: 0;
padding: 0;
position: absolute;
left: 50%;
top: 50%;
opacity: 0;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
text-align: center;
z-index: 100;
}
@media screen { body>div#energysaving { position: fixed; } }
div#energysaving p
{
margin: 0;
padding: 0;
width: 100%;
font-size: 18px;
font-family: arial;
color: #FFD900;
position: relative;
top: 40%;
line-height: 20px;
font-weight: bold;
text-align: center;
text-shadow: none;
}
div#energysaving p span
{
color: #fff;
font-size: 12px;
font-weight: normal;
}
div#energysaving div#copyrightOnlineLeaf
{
padding: 0;
margin: 0;
color: #fff;
font-size: 12px;
font-weight: normal;
position: absolute;
bottom: 20px;
text-align: center;
width: 100%;
height: 20px;
left: 0%;
}
Envolver el Script de la publicidad
Debemos envolver el Script de la publicidad, por ejemplo de Adsense dentro de <div class="adsantilok">
y </div> para que actué como gatillo y lance el bloqueador, por ejemplo:
<div class="adsantilok">
<script type="text/javascript"><!--
google_ad_client = "";
google_ad_host = "-";
/* 120x600, tira vertical */
google_ad_slot = "2993497637";
google_ad_width = 120;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
El resultado debe lanzar una ventana en ventana del navegador que diga:

Comentarios y Consultas

Los mensajes serán revisados a veces. No te olvides que soy una persona, no se trata de faltar al respeto, todos tenemos opiniones, no hay que enojarse.

Puedes marcar Notificarme para recibir la notificación de la respuesta.

13 comentarios:

  1. Uso adblock plus en Chrome en Linux, y no veo ninguna ventana que me impida ver el contenido de la web. No obstante, nunca visito tu web directamente, sólo a través de los rss.

    ResponderBorrar
  2. Yo no he implementado este script en mi sitio web, lo probé, pero como dije antes; tiene sus inconvenientes.
    Por ejemplo, no tiene sentido si se desactiva Javascript o la gente tiene acceso al sitio por el RSS y desde luego guardando la página y editándola.

    ResponderBorrar
  3. Gracias creo que lo debemos instalar todos, por mi parte lo voy a probar. No tiene entido que un visitante se meta en tu pagina y bloquee parte de su conbtenido.

    ResponderBorrar
  4. amigo el tuto esta bueno pero no entiendo 2 cosas:

    1) como Insertar en la sección CSS de la página, la verdad es que no tengo idea en donde se inserta ese codigo.

    2)Envolver el Script de la publicidad, en si no se en que parte debo pegar ese codigo.

    Me gustaria que me respondieras para poner en practica este tuto en mis blogs

    ResponderBorrar
    Respuestas
    1. Te sugiero no lo hagas, si no sabes lo básico de CSS o HTML creo que deberías empezar po aprender donde va cada cosa, pues este Script puede dar dolores de cabeza si no sabes lo básico.

      Borrar
  5. Muchas gracias amigo, funciona a la perfeccion, gran tutorial... saludos

    ResponderBorrar
  6. amigos despues de usar este scrip, tengo un probelma luedo de desabilidar el adblock, sigue estando el div, lo cual me perjudica porque no puedo clickear nada de bajo de eso, no se me queda en el centro, se me queda a un costado en medio de la pantalla lo cual hace que todo lo que quede abajo del div no pueda hacerse click, por favor espero ayuda

    ResponderBorrar
    Respuestas
    1. Mira yo he usado este script por mucho tiempo, así que puedo desaconsejar su uso, funciona perfectamente en un navegador, pero te da problemas con otros, este tipo de técnicas son hechas para sitios webs donde no tengas acceso a un espacio web propio, pero tiene muchísimo inconvenientes y no veo que sea determinante para aumentar tus ingresos.

      Sería mejor un aviso pidiendo a tus usuarios no bloquear tus anuncios.

      Borrar
    2. el error se encuentra en el codigo html que va antes de la etiqueta /body si alguien encuentra una forma de solucionarlo espero la pueda compartir

      Borrar
  7. y no hay de ninguna forma poder editarlo, porque el div energysaving se queda en pantalla una vez desactivado el adblok, por favor necesitaria que alguien me ayude con eso desde ya gracias

    ResponderBorrar
    Respuestas
    1. Yo no lo usaría, hace tiempo estoy desconectado de bloqueadores de publicidad, pero estos scripts tienen muchos defectos al no tener acceso a un espacio web propio.

      Borrar
  8. hola tengo un proble con el scripts esque siempre salta aunque no haya adblock no la pagina este en sitio de confiansa que podria hacer

    ResponderBorrar
  9. Hola he implementado el artilugio y parece que va bien, pero me ha surgido un problema al instalar el jquery en la head, el menu desplegable que tengo puesto no funciona como debería.

    Los uls no se marcan con flechita y si tengo varios enecadenados, en cuanto pongo el cursor encima del menu se despliegan todos los submenus.

    He ido quitando el código poco a poco y la cosa se soluciona cuando he quitado lo que he introducido en la head justo antes de /head como pone en el post.

    Si teneis alguna idea. Un saludo

    ResponderBorrar

El ascenso de Skywalker(2019)

Joker 2019Una película que ha roto a divido a los fans muchos culparán a sus director por querer reparar Los últimos Jedi, no es su culpa al final.

[Leer artículo...]

La Espada del Inmortal (2019

Blade of The Immortal (2019)La historia de Manji, un guerrero samurái sin señor que ha sido condenado con la inmortalidad...

[Leer artículo...]

Kemono Michi: Rise Up (2019)

Kemono Michi: Rise Up (2019)Del autor de Konosuba, Genzo Shibata es un luchador japonés que es transportado a un mundo de fantasía, quien está obsesionado con los seres peludos.

[Leer artículo...]

ELI (2019)de Netflix

ELI (2019)de Netflix Reseña y criticaPelícula lanzada directo a video que nos cuenta una historia que parecería sacada de la Dimensión desconocida.

[Leer artículo...]

  © Cgnauta | CGsign blog | [Ver Licencia de uso] | Matius Lenin, Creative Commons, algunos derechos reservados

Regresar ARRIBA  

Vistas desde Mayo 2009

▼/▲ Archivo del Blog

Visitas totales

Información

IBSN: Internet Blog Serial Number 01-77-94-2008

Esta plantilla es creada y diseñada por Matius Lenin para CGnauta blog. Con Scripts de JQuery bajo licencia GNU/GPL. CGnauta es una marca registrada propiedad de Matius Lenin.