Gadget Disminuir y Aumentar el tamaño de la fuente

En éste mundo, hay muchas personas que sufren dificultades visuales, o gentío de la tercera edad, que mediante van pasando los años, van perdiendo la vista paulatinamente, malogradamente, nos suele pasar a todos, cuando nos hacemos mayores. Así que está herramienta que os presento hoy, puede ser un gadget de gran utilidad, para aumentar el texto o disminuir el texto al gusto del lector, qué lee nuestros escritos. Para ello, lo haremos de distintas formas, para que elijan la que más les gust,e o se adecue a su predilección. Éste gadget, lo podéis ver en muchos periódicos de tirada digital, enjoy this.

Demo Tamaño Fuente!
Vayamos, con la primera opción, ésta será mediante dos botones!

1. Entra en Blogger.
2. Y ahora ves a Plantilla & Editar HTML.
3. Copia y pega los siguiente Script.
4. Una vez copiado el CSS, busca con Ctrl+F la etiqueta </head>:
5. Y antes de dicha etiqueta añade los siguiente código.

<!-- cambiar tamaño de la fuente desde Aizum Blog-->
<script type='text/javascript'>
var tgs=new Array('div','td');
var szs=new Array('xx-small','x-small','small','medium','large','x-large','xx-large');
var startSz=2;
function ts(trgt,inc) {
if (!document.getElementById) return

var d=document,
cEl=null,sz=startSz,i,j,cTags;
sz += inc;
if (sz < 0) sz=0;
if (sz > 6) sz=6;
startSz=sz;
if ( !(cEl=d.getElementById(trgt))) cEl=d.getElementsByTagName(trgt)[0];
cEl.style.fontSize=szs[sz];
for (i=0 ; i < tgs.length; i++) {
cTags=cEl.getElementsByTagName(tgs[i]);
for (j=0; j < cTags.length ; j++) cTags[j].style.fontSize=szs[sz];
}
}
</script>

Ahora vayamos a insertar los Botones de aumento y disminución!

1. Estando en Blogger.
2. Ves a Diseño de Blogger y después, en Añadir un Gadget.
3. Seguidamente elige la opción HTML And Javascript.
4. Y copia y pega el siguiente código HTML en forma de gadget.
5. Ten en cuenta que en el código HTML, puedes cambiar body por main.
6. Esto quiere decir qué la opción body, podrás aumentar y disminuir la letra en todo el blog.
7. Pero si cambias, la configuración por main, cambiará el aumento y la disminución de la letra, solamente en el cuerpo de las entradas.
8. Ten en cuenta otra configuración, puedes cambiar el botón o el código de imagen, por texto.

<a href="javascript:ts('body',1)"><img src="https://lh3.googleusercontent.com/-lAbWCQEjc2k/U5pT4CrtzLI/AAAAAAAAUno/mXoA0iNLkY4/s70-no/fontsizeup_koffice_opt.png"/></a>
<a href="javascript:ts('body',-1)"><img src="https://lh3.googleusercontent.com/-5hGLH1kihxo/U5pUII8RXTI/AAAAAAAAUn8/MdTSqlCrimw/s70-no/fontsizedown_koffice_opt.png"/></a>

Segunda opción, sería mediante numeración, con HTML y algo de Script!
Tamaño de la letra: 10 12 14 16 18 20 22

1. Cada numeración corresponde a el tamaño del font-size.
2. Al hacer clic en la numeración elegida, cambiará el tamaño de la fuente.
3. Para añadir está herramienta en tu blog de Blogger.
4. Copia y pega el siguiente código HTML en forma de gadget.
5. Es decir, te vas a Diseño y luego en Añadir un Gadget y luego HTML and Javascript, y pegas.
6. Puedes incrementar la numeración del tamaño de la fuente añadiendo más líneas o viceversa.

Tamaño de letra: <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='10px'"><span>10</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='12px'"><span>12</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='14px'"><span>14</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='16px'"><span>16</span></a> <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='18px'"><span>18</span></a>

Vagabundia
Get free premium widgets for your blog and website.