martes, 20 de diciembre de 2011

- "Efectos Navideños: Copos de Nieve" - Trucos Blogger

Ahora que se acercan de nuevos tiempos navideños, os pongo un script que he encontrado en el que los copos de nieve son distinguibles sobre fondo blanco y que quedan muy bien.

Es éste:

<script type="text/javascript">
var _snow_type = 1; // cambiar el tipo de nieve, las opciones son 1 ó 2
var _snow_flakes = 90; // el número de copos de nieve
var _snow_speed = 7; // la velocidad de la nieve en caer, medido en pixeles
var _snow_min_time = 20; // el mínimo de ms entre los movimientos - mínimo y máximo hace que parezca al azar
var _snow_max_time = 30; // el máximo de ms entre los movimientos
</script>
<script src="
http://snowysites.com/snow.js" type="text/javascript">
</script>

 

Si queréis seleccionar el código, pulsar aquí.

Aplicarlo es muy sencillo. Tan sólo hay que copiarlo en la plantilla de diseño, en la edición html, al final del todo, antes de </head> (como siempre, es mejor hacer una copia de seguridad antes de realizar cualquier cambio).
 
Como véis se puede variar el nº de copos, su velocidad,... así podréis adaptarlo un poco más a vuestro gusto.

Este script lo he sacado de: Todo Blogger

jueves, 31 de marzo de 2011

- "¿Cómo evitar que te cojan imágenes desde google?"

La mayoría de los bloggeros somos adictos a las estadísticas -que son la mejor manera de detectar a los lectores tímidos o mudos- y gracias ello es fácil notar la cantidad de visitas que llegan a través de la búsqueda de imágenes.

Lo cual hace pensar en un espinoso problema. Aunque tú protejas tus imágenes con "anticopiones" en el blog, google se lo salta a la torera y pone la dirección url directa de la imagen.

Era un tema al que llevaba tiempo dándole vueltas, hasta que he encontrado un código sencillo -ya sabes, mi tendencia a la vaguería y a no pensar- que permite que cuando alguien busca una imagen tuya en un buscador e intenta acceder a su tamaño real para copiarla... le redireccione directamente a tu blog (es decir, evitar el frame de Google Imágenes y de otros similares), dónde ya no podrá hacerlo. Si has ido leyendo los trucos blogger que voy dando, claro.

¡Dos pájaros de un tiro!

Haces que los copiones se tengan que currar más la vida y aumentas tu número de visitas y, por lo tanto, de gente que puede conocer lo que tienes que decir.

No dí saltos de alegría cuando lo encontré porque eran las tres de la mañana y mi vecina de abajo podía subir con la escoba... pero sí que me marqué un bailecito de celebración.

Instrucciones para introducir el Código:

¡Facilísimo!

Te vas a la pestaña de "Diseño", entras en la vista "html", localizas el cierre del head de la plantilla (</head>) y un poco antes, insertas este pequeño JavaScript:

<script type='text/javascript'>
if(top.location!=this.location) top.location=this.location;
</script>

Si quieres copiar el código tienes que pulsar aquí.


En realidad esto no evita que se puedan mostrar la URL de la imagen en un marco, pero en cuanto el script se carga, se realiza una redirección a tu blog; lo que al menos les complica la vida.

Es fácil comprobar cómo funciona.

Sigues las instrucciones, lo instalas y haces la prueba buscando por el nombre de tu blog. De entre las que te salga, pinchas en una de tus imágenes... y ves lo que pasa.

Pegas:
Las pegas son para los manitas que usan "iframes", ya que este código evita que cualquiera pueda meterte en un "iframe" -incluído tú mismo-.

Espero que te sea tan útil como a mi.


El código lo he sacado de este blog, por si os interesa.

jueves, 17 de marzo de 2011

- "¿Cómo abrir un pop-up (ventana emergente)?" - Trucos Blogger

Sigo con mi semana de "reposo mental".

Hoy un truquito más para bloggear con arte.

En ocasiones, nos hace falta que brote de nuestro blog una ventana emergente (pop-up) de un tamaño determinado y no sabemos como apañárnoslas para hacerlo.

Para esos momentos de duda existencial, está este código:

<a href="URL COMPLETA DEL ARCHIVO" target="_blank" onClick="window.open(this.href, this.target, 'width=300,height=400,top=200px,left=300px'); return false;">TEXTO PARA PINCHAR</a>

En morado está el texto que podéis modificar sin problemas y en granate os he puesto las instrucciones que podéis eliminar si no queréis predeterminar el tamaño de la ventana que se abra.

Ejemplo:
Un ejemplo que os llevará a una mini-ficha de autora del blog, es decir... yo.

Si queréis seleccionar el código, pulsar aquí.

Por si queréis consultar la fuente, este código lo he sacado de esta página.

viernes, 4 de marzo de 2011

- "¿Cómo poner una imagen fija a la derecha de la página?" - Trucos Blogger

Como muchos me habéis preguntado por cómo he puesto la imagen de la derecha de "deja un comentario" y cómo he hecho para que se mueva conforme el lector lea... Os voy a responder.

Más fácil imposible.

  • PASO 1:
    En el menú de Bloger os váis a:
    Diseño -> Agregar Gadget -> Html/Javascript
    Y añadís un nuevo Gadget al final de la columna de la derecha.

  • PASO 2:
    Editáis el Gadget. No ponéis título para que no os salga nada en la columna e introducís el siguiente código:

    <img style="display:scroll;position:fixed;bottom:0px;right:0px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLX-S2vZo163F3tmuRM6NarzB2BcOelnIVIIHlqNpZAjQYsThhYGkfx6qyKHgDY2wEyfGKVVqiCGD0VbIca8Pr9N_ZobS65vTRbVTPi0vssnx64luxHc1chhapNk3X8z6PAkim-lOuezkG/s320/Deja_Comentario.jpg" />

  • PASO 3:
    Cambiar el texto en rojo por la imagen que tengáis almacenada y que más os guste.

  • PASO 4:
    Esperar que os hagan caso.

Si queréis seleccionar el código, pulsar aquí.


lunes, 31 de enero de 2011

- "¿Cómo hacer que salte una alerta cuando quieren seleccionar un texto?" - Trucos Blogger

Hay veces que no se quiere proteger todo el texto de una página web, sino tan sólo un trocito pequeño y que a los que intenten apropiárselo, les salte un pequeño mensaje de advertencia, y para eso lo mejor es este código que se puede aplicar directamente en la ventana de creación de entradas de blogger, por ejemplo.

<font oncontextmenu = "alert('Material Protegido');return false;" onselectstart = "alert('Material Protegido');return false;" onkeydown="alert('Material Protegido');return false;" ondragstart = "alert('Material Protegido');return false;" size="2px">TEXTO QUE SE QUIERE PROTEGER</font>

En morado os he puesto el texto que podéis modificar para que salga vuestro propio mensaje de advertencia.

Si queréis seleccionar el código, pulsar aquí.


He sacado este código de esta página, por si os interesan otras instrucciones por el estilo.

sábado, 15 de enero de 2011

- "¿Cómo hacer un spoiler desplegable?" - Trucos Blogger

El paso siguiente, después de evitar que te copien el texto de las entradas, es preguntarse... ¿Y ahora cómo hago que se puedan ver los spoilers sin necesidad de subrayar el texto? Si te has encontrado en la misma situación que yo... este truco te será útil. También es adecuado cuando deseas poner un fondo de blog distinto del blanco y que tus spoilers sigan siendo invisibles para los "no cotillas".

Pasemos a la acción. Os resalto en rojo el código html que es imprescindible para que el truco funcione, el resto son cosas que yo utilizo para "hacer bonito".

Si queréis seleccionar el código, pulsar aquí.

  • Un solo spoiler:

<table border="2" bordercolor="#660000">
<tr><td> <div id="ver_on1"><font size="1
"><h1 id="titu"><a href="#" onclick="mostrar1('bloque1')" title="Expandir info">DESPLEGAR SPOILER</a></h1></div><div id="ver_off1" style="display: none">
<h1><a href="#" onclick="ocultar1('bloque1')" title="Cerrar info">CONTRAER SPOILER </a></h1>
</font>
</div><div id="bloque1" style="display: none">TEXTO DEL SPOILER</div></td></tr>
</table>


<script type="text/javascript">
//Ocultar/Mostrar Div's
OCULTO="none";
VISIBLE="block";
  function mostrar1(blo) {
    document.getElementById(blo).style.display=VISIBLE;
    document.getElementById('ver_off1').style.display=VISIBLE;
    document.getElementById('ver_on1').style.display=OCULTO;
    }
  function ocultar1(blo) {
    document.getElementById(blo).style.display=OCULTO;
    document.getElementById('ver_off1').style.display=OCULTO;
    document.getElementById('ver_on1').style.display=VISIBLE;
    }
 
</script>
En morado os he puesto el texto que podéis modificar a voluntad.

  • Dos Spoilers:

 <table border="2" bordercolor="#660000">
<tr><td> <div id="ver_on1"><font size="1
"><h1 id="titu"><a href="#" onclick="mostrar1('bloque1')" title="Expandir info">DESPLEGAR SPOILER 1</a></h1></div><div id="ver_off1" style="display: none">
<h1><a href="#" onclick="ocultar1('bloque1')" title="Cerrar info">CONTRAER SPOILER 2 </a></h1>
</font>
</div><div id="bloque1" style="display: none">TEXTO DEL SPOILER</div></td></tr>
</table>


<table border="2" bordercolor="#660000">
<tr><td><b> <div id="ver_on2"><font size="1">
<h1 id="titu"><a href="#" onclick="mostrar2('bloque2')" title="Expandir info">DESPLEGAR SPOILER 2</a></h1></div><div id="ver_off2" style="display: none">
<h1><a href="#" onclick="ocultar2('bloque2')" title="Cerrar info">CONTRAER SPOILER 2</a></h1>
</font>
</div></b><div id="bloque2" style="display: none">TEXTO DEL SPOILER</div></td></tr>
</table>



<script type="text/javascript">
//Ocultar/Mostrar Div's
OCULTO="none";
VISIBLE="block";
  function mostrar1(blo) {
    document.getElementById(blo).style.display=VISIBLE;
    document.getElementById('ver_off1').style.display=VISIBLE;
    document.getElementById('ver_on1').style.display=OCULTO;
    }
  function ocultar1(blo) {
    document.getElementById(blo).style.display=OCULTO;
    document.getElementById('ver_off1').style.display=OCULTO;
    document.getElementById('ver_on1').style.display=VISIBLE;
    }
  function mostrar2(blo) {
    document.getElementById(blo).style.display=VISIBLE;
    document.getElementById('ver_off2').style.display=VISIBLE;
    document.getElementById('ver_on2').style.display=OCULTO;
    }
  function ocultar2(blo) {
    document.getElementById(blo).style.display=OCULTO;
    document.getElementById('ver_off2').style.display=OCULTO;
    document.getElementById('ver_on2').style.display=VISIBLE;
    }

</script>

Como podréis observar, la diferencia entre ambos es que se ha añadido una nueva secuencia "<div>", nombrándola como "2" cuando ha sido necesario, y en el script también se le ha añadido una nueva "}function ocultar2(blo)}".

  • Más de dos Spoilers:
Repetir el proceso "n" veces hasta que nos cansemos de poner los dichosos spoilers.


Este código está basado en el que sale en este link, aunque modificado por mi.

miércoles, 5 de enero de 2011

- "¿Cómo evitar que te seleccionen el texto?" - Trucos Blogger

He decidido empezar una nueva sección con trucos útiles para los bloggeros, ya que a mi me cuesta Dios y ayuda encontrar lo que me quiero hacer.

De vez en cuando os iré poniendo los mejores.

Éste es uno que llevaba mucho tiempo buscando.

Para evitar que te seleccionen el texto en el blog -y que si te quieren copiar al menos tengan que tecleárselo todo...- es éste.
  1. Te vas a la plantilla html del blog (Es conveniente hacer una copia de seguridad antes de hacer cualquier tipo de cambio en la plantilla).
  2. Presionas "ctrl" + "F" para que te salga el menú de búsqueda y tecleas: <body>
  3. Lo sustituyes por:
<body onmousedown='return false;' onselectstart='return false;'>

¡Y listo!

Si queréis seleccionar el código, pulsar aquí.


Para los que estén interesados lo he sacado de éste blog: http://ociosoft.blogspot.com/2008/11/cmo-evitar-que-copien-el-contenido-de.html

Entradas populares