Agrandar o achicar textos en blog

Seguramente este truco ya lo haz visto, no sólo en algunos blogs, sino también en algunos periódicos virtuales.
Se trata de dos enlaces (en este caso botones) que hacen que las letras del blog completo se achiquen o agranden, según los que indique el botón, para gente con alguna discapacidad visual. Además incluye un botón que hace que las letras vuelvan al tamaño original.

El ejemplo del truco, puedes encontrarlo en el Laboratorio de T.B (2)

Poner botones para agrandar o achicar letra en el blog

Hay un detalle que no mencioné, y es que este truco posee efectos de jquery.
Para instalar el Script del truco debemos ir a Blogger → Diseño → Edición de HTML → Buscamos la etiqueta </head> presionando ctrl+f → Cuando hayamos encontrado la etiqueta </head>, pegamos el siguiente código arriba de la etiqueta:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

<!-- más trucos jquery en teoriablogger.blogspot.com -->
<script type='text/javascript'>
$(function(){$(&#39;input&#39;).click(function(){
var ourText = $(&#39;#content-wrapper&#39;);
var currFontSize = ourText.css(&#39;fontSize&#39;);
var finalNum = parseFloat(currFontSize, 10);
var stringEnding = currFontSize.slice(-2);
if(this.id == &#39;a&#39;) {finalNum *= 1.1;}
else if (this.id == &#39;achicar&#39;){finalNum /=1.1;}
else if (this.id == &#39;reiniciar&#39;){finalNum =13;}
ourText.animate({fontSize: finalNum + stringEnding},500);});});
</script>

Si ya haz utilizado un código Jquery antes, no agregues el código que está escrito en rojo.
El próximo paso es agregar los botones al blog, a los botones los vamos a alojar en un gadget. Vamos a Blogger → Diseño → Elementos de la página → Elegimos la opción HTML/Javascript y pegamos los códgios siguientes:

<div id='resizefont'>
<input id="agrandar" title="teoriablogger.blogspot.com" type="button" value="A+" />
<input id="reiniciar" title="teoriablogger.blogspot.com" type="button" value="A" />
<input id="achicar" title="teoriablogger.blogspot.com" type="button" value="A-" />
</div>

Debes saber que estos botones sólo achican o agrandan palabras o letras, no imágenes o objetos de video o algo por el estilo.

Rotador de botones y links

Este pequeño truco es un botón (común) que tiene la particularidad de que rota las palabras de este, y a la vez, cambia el enlace según el texto que contenga en ese momento.
Puedes ver el truco en el Laboratorio de Teoría Blogger

Obtener un rotador de botones

Esta especie de tener "muchos botones en uno", se puede agregar al blog añadiéndolo a la barra lateral (sidebar).
Por eso vamos a Blogger → Diseño → Elementos de la página → Click en el link Añadir un gadget y pegamos este código:

<script language="JavaScript">
<!-- Mas trucos en teoriablogger.blogspot.com -->
var timerID = null
var timerRunning = false
var charNo = 0
var charMax = 0
var lineaNo = 0
var lineaMax = 5
var lineaArr = new Array(lineaMax)
var urlArr = new Array(lineaMax)

lineaArr[1] = "Lo que muestra el botón "
urlArr[1] = "http://urldeblog"
lineaArr[2] = "Lo que muestra el botón 2"
urlArr[2] = "http://urldeblog"
lineaArr[3] = "Lo que muestra el botón 3"
urlArr[3] = "http://urldeblog"
lineaArr[4] = "Lo que muestra el botón 4"
urlArr[4] = "http://urldeblog"
var lineaText = lineaArr[1]
function StartShow() {
StopShow()
Showlinea()
timerRunning = true
}
function FillSpaces() {
for (var i = 1; i <= lineaWidth; i++) {
spaces += " "
}
}
function StopShow() {
if (timerRunning) {
clearTimeout(timerID)
timerRunning = false
}
}
function Showlinea() {
if (charNo == 0) {
if (lineaNo < lineaMax) {
lineaNo++
}
else {
lineaNo = 1
}
lineaText = lineaArr[lineaNo]
charMax = lineaText.length
}
if (charNo <= charMax) {
document.formDisplay.buttonFace.value = lineaText.substring(0, charNo)
charNo++
timerID = setTimeout("Showlinea()", 100)
}
else {
charNo = 0
timerID = setTimeout("Showlinea()", 3000)
}
}
function IraUrl(url)
{
top.location.href = url
}
document.write("<form name="formDisplay">");
document.write("<input type="button" name="buttonFace" value="&{lineaText}" size="18" onClick="IraUrl(urlArr[lineaNo])">");
document.write("</form>");
StartShow();
</script>

Para modificar el script a tu gusto, debes modificar lo que está en rojo para que establezcas los textos que quieres que se cambien. Y modifica lo escrito en verde por la dirección que se quiere ir cuando aparezca el debido texto.
Se pueden agregar más textos (y sus URLs) siempre y cuando logres el orden de los números de lineaArr y urlArr del código dado.

Enlace spoiler en blogger

El enlace Spoiler, es un enlace que al hacer click en él, sobresale un texto o lo que sea por debajo y al hacer click en el mismo enlace luego, cierra todo el contenido.

Insertar un enlace Spoiler

Este enlace se puede agregar tanto en una entrada como en un gadget y además se pueden agregar varios a la vez.
Para mostrarles cómo queda un enlace spoiler observen este enlace:

Abrir[+]

Este es el contenido del spoiler.

El código es:

<div><a href="#" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.innerHTML = 'Cerrar[-]';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.innerHTML = 'Abrir[+]';}return false" title="teoriablogger.blogspot.com" type="button">Abrir[+]</a><div style="display: none;">Este es el contenido del spoiler.</div></div>

Para modificar el spoiler, haz lo siguiente:
Lo que está marcado en rojo, es la palabra que cerraría el spoiler cuando esta abierto.
Lo que esta marcado en violeta, son las palabras que van cuando el spoiler esta cerrado.
Y lo que esta en verde, es la frase o el contenido del spoiler.
En el contenido puedes poner lo que quieras: enlaces, elementos flash, y más.

¿Y en forma de botón?

En forma de botón tiene la misma función y quedaría así:
Lo puedes hacer en forma de botón:

Este es el contenido del spoiler.

El código es:

<div><input value="Abrir[+]" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Cerrar[-]';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Abrir[+]';}" type="button"><div style="display: none;">Este es el contenido del spoiler.</div></div>

Y a los textos los modificas como al modo enlace spoiler.