lunes, 11 de marzo de 2013

La Hora del Planeta: apaga tu sitio, enciende el planeta

Cómo instalar el plugin para apagar el blog/web durante La Hora del Planeta

Sábado 28 de Marzo 20:30 - 21:30h
¿Qué es?
La Hora del Planeta es un gesto simbólico que se celebra en casi todos los países del mundo, y que consiste en apagar la luz durante los 60 minutos de un día del año, como medida de ahorro energético en beneficio de la salud de nuestro planeta.

El evento ocurrirá el próximo sábado 28 de marzo, de 20:30 a 21:30 horas. Puedes encontrar más información en la web española, http://www.horadelplaneta.es y en la web internacional, http://earthhour.org/node?direct=true.

Nosotros, además de apagar la luz en nuestra casa, apagaremos simbólicamente nuestro sitio en Internet para sumarnos a este gesto. Para esto he diseñado una utilidad que simula el apagado, impidiendo el acceso a cualquier enlace de la página durante los 60 minutos del día señalado. A continuación explico como instalarla.

La utilidad ha de ser insertada en un lugar del blog o web que se ejecute siempre, independientemente de la página solicitada, por ejemplo si lo tuyo es un blog, lo más práctico es que lo instales como un gadget HTML, tal y como puedes ver en la columna de la izquierda en este blog.

Añade el gadget:


Y añade estas líneas de código al gadget:
<div style="width:269px;background-color:white;padding-bottom:1px;">
<div style="width:269px;color:#c4d7e8;font-weight:bold;background-color:black;text-align:center;padding-top:2px;">Sábado 28 de Marzo 20:30 - 21:30h</div>
<img style="width:269px;height:107px;" src="http://lh3.googleusercontent.com/-oIeSZtLTaUk/UT3BukZPyzI/AAAAAAAAJ_Y/1Nh5RtMKpvo/s269/logo-H-Planeta.jpg" />
<ul style="margin-left:21px;margin-top:7px;font-size:0.9em;list-style-image: url(http://lh3.ggpht.com/_5SvLLd6obBo/TOuVgy3QgNI/AAAAAAAAEHA/NWYdfZ4y-BA/s0/diamond_red.gif);">
<li style="margin-bottom:7px;"><a target="newhp" href="http://www.horadelplaneta.es/que-es">¿Qué es?</a></li>
<li style="margin-bottom:7px;">Este sitio se apagará simbólicamente durante La Hora del Planeta (<a href="javascript:;" onclick="FADEAR(60);">probar ahora durante 60 segundos</a>)</li>
<li><a href="http://bikertb-blog-howto.blogspot.com/2013/03/la-hora-del-planeta-apaga-tu-sitio.html">Instalar esto en mi sitio</a></li>
</ul>
</div>

<!-- Corrige la posición de objetos flash -->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<script type='text/javascript'>
$(document).ready(function() {
    $("iframe").each(function(){
        var ifr_source = $(this).attr('src');
        var wmode = "wmode=transparent";
        if(ifr_source.indexOf('?') != -1) {
            var getQString = ifr_source.split('?');
            var oldString = getQString[1];
            var newString = getQString[0];
            $(this).attr('src',newString+'?'+wmode+'&'+oldString);
        }
        else $(this).attr('src',ifr_source+'?'+wmode);
    });
});
</script>

<!-- Bloquea el acceso al blog el 28 de marzo de 2015, desde las 20:30h a las 21:30h -->
<script src='http://sites.google.com/site/bikertb/ficheros-para-el-blog/hora-planeta-d.js' type='text/JavaScript'></script>

Y ya está, el gadget se mostrará igual que ves en este blog, y el día 28 de marzo de 2015, entre las 20:30 y las 21:30 horas, esta utilidad apagará tu blog/web de la forma que puedes ver en esta muestra: Probar durante 5 segundos

Si tu sitio es una web en lugar de un blog, y dispones de un área de gadgets o widgets, que aparezcan siempre independientemente de la página solicitada, también puedes añadir el código anterior en esa área.

Si no dispones de ese área de gadgets, puedes añadir el siguiente código a la cabecera html de la web. El código ha de situarse justo antes de la etiqueta </head>. Aunque en este caso no se verán la imágen de la utilidad ni los enlaces.

Añade estas líneas de código a la cebecera html de tu web sin gadgets:
<!-- Corrige la posición de objetos flash -->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<script type='text/javascript'>
$(document).ready(function() {
    $("iframe").each(function(){
        var ifr_source = $(this).attr('src');
        var wmode = "wmode=transparent";
        if(ifr_source.indexOf('?') != -1) {
            var getQString = ifr_source.split('?');
            var oldString = getQString[1];
            var newString = getQString[0];
            $(this).attr('src',newString+'?'+wmode+'&'+oldString);
        }
        else $(this).attr('src',ifr_source+'?'+wmode);
    });
});
</script>

<!-- Bloquea el acceso al blog el 28 de marzo de 2015, desde las 20:30h a las 21:30h -->
<script src='http://sites.google.com/site/bikertb/ficheros-para-el-blog/hora-planeta-d.js' type='text/JavaScript'></script>
</head>

El día 28 de marzo de 2015, entre las 20:30 y las 21:30 horas, esta utilidad apagará tu blog/web de la forma que puedes ver en esta muestra: Probar durante 5 segundos

Pasada La Hora del Planeta, puedes eliminar el código de esta utilidad de la cabecera html de tu página.