Aumentar / Disminuir tamaño del texto en las entradas

Vamos a ver mediante el uso de un script creado por Clau de Gothic Darkness como añadir unos botones debajo del título de cada entrada que permitan el aumentar o disminuir el texto de las entradas, para facilitar su lectura.

[1] En primer lugar tendremos que añadir un script antes de la etiqueta </head> de nuestra plantilla:

<!-- Script Aumentar/Diminuir Fonte by http://www.mundodarkness.com/ -->
<script type='text/javascript'>
//<![CDATA[
function fontMais(){
var obj = document.getElementById("textoFonte");
if (obj.style.fontSize==""){obj.style.fontSize="12px"};
if (obj.style.fontSize=="10px"){obj.style.fontSize = "12px";}
else if (obj.style.fontSize=="12px"){obj.style.fontSize = "15px";}
else if (obj.style.fontSize=="15px"){obj.style.fontSize = "17px";}
else if (obj.style.fontSize=="17px"){obj.style.fontSize = "19px";}
else if (obj.style.fontSize=="19px"){obj.style.fontSize = "21px";}
}
function fontMenos(){
var obj = document.getElementById("textoFonte");
if (obj.style.fontSize==""){obj.style.fontSize="12px"};
if (obj.style.fontSize=="21px"){obj.style.fontSize = "19px";}
else if (obj.style.fontSize=="19px"){obj.style.fontSize = "17px";}
else if (obj.style.fontSize=="17px"){obj.style.fontSize = "15px";}
else if (obj.style.fontSize=="15px"){obj.style.fontSize = "12px";}
else if (obj.style.fontSize=="12px"){obj.style.fontSize = "10px";}
}
//]]>
</script>
<!-- Fim Script Aumentar/Diminuir Fonte by http://www.mundodarkness.com/ -->

[2] Guardamos los cambios.

[3] Marcamos entonces la opción de "Expandir las plantillas de artilugios" para localizar la siguiente etiqueta:

<div class='post-header-line-1'>

Justo debajo de esa etiqueta, añadimos el código para mostrar los botones de aumentar y disminuir el texto debajo del título de las entradas:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a alt='Aumentar fuente' href='javascript:fontMais()'><img src='http://img405.imageshack.us/img405/2006/fontmais.gif'/></a>
<a alt='Disminuir fuente' href='javascript:fontMenos()'><img src='http://img707.imageshack.us/img707/359/fontmenos.gif'/></a></b:if>

Nota:

En el caso de que esa etiqueta se muestre en la plantilla con barra de cierre al final:
<div class='post-header-line-1'/>
tendremos que retirar la barra y cerrar con un </div>, es decir, de esta manera:

<div class='post-header-line-1'>
<--- Aquí el código para mostrar los botones --->
</div>

[4] Localizamos ahora esta parte del código de la plantilla:

<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Y añadimos el código destacado en negrita tal como vemos en el ejemplo:

<div class='post-body entry-content'>
<div id="textoFonte">
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>

[5] Guardamos los cambios y comprobamos nuestro blog, si todo ha ido bien, ya tendremos los botones para aumentar y disminuir el texto funcionando en cada entrada.

Modificaciones:

Para utilizar nuestros propios botones, cambiamos en este mismo código la url de las imágenes por la de las nuestras, (destacadas en color verde).

ARTICULO ORIGINAL:Gothic Darkness

Nota traducida de la autora original:
Si desea publicar este script en su blog, no lo dude, pero sea consecuente, no plagie su tutorial y de los créditos de la publicación original, lo que indica un enlace en su artículo al publicado en Gothic Darkness.