CAMBIAR EL TAMAÑO DE LETRA DEL BLOG A OPCIÓN DEL LECTOR

by Blogs Famag - martes, enero 15, 2019

CAMBIAR EL TAMAÑO DE LETRA DEL BLOG A OPCIÓN DEL LECTOR.

De acuerdo al contenido del blog es al público al que está dirigido y es posible que este público sean adultos mayores o bien tengan dificultades visuales. Así que una buena herramienta es darles la opción de que sean ellos quienes elijan el tamaño del texto del blog y puedan cambiarlo a su gusto. Para ello vamos a usar dos métodos:

El primero es que el lector escoja el tamaño exacto de la letra. Para lograr esto sólo pegamos este código en un elemento HTML/Javascript:

Ir a Blogger

1-Un clic en “Diseño”

2-Clic en “Añadir un gadget”

3-Busca el widget que dice “HTML-Javascript” y ábrelo

4-Coloca el siguiente codigo en el interior

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

Las opciones de tamaño de la fuente van desde 10 hasta 18 puntos, puedes agregar las que quieras repitiendo la línea correspondiente.

Si queréis verlo en acción podéis ir a mi Bloc de Demos lo veréis en el sidebar con el nombre

Cambiar el tamaño de letra

2ª OPCIÓN

La segunda opción la vi en Vagabundia y se trata de cambiar el tamaño de la letra con dos botónes, uno para aumentar y otro para disminuir.
Primero hay que ir a Plantilla | Edición de HTML y pegar antes de </head> lo siguiente:

Un clic en “Plantilla”

Un clic en “Editar HTML”

Ahora se te abrirá el Editor HTML de tu plantilla

En este punto deberás presionar la tecla “Control” de tu teclado seguido de la tecla “F” para que aparezca el buscador integrado en la parte superior derecha de tu editor,
debes esperar unos segundos hasta que se muestre, aquí es donde tendrás que insertar el código para buscarlo e insertar los códigos correspondientes en el editor,

Busca el siguiente código

</head>

Ahora justo encima (ó antes) de esa etiqueta, pegamos lo siguiente:

<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 en un elemento HTML/Javascript pega esto:

Ir a Blogger

1-Un clic en “Diseño”

2-Clic en “Añadir un gadget”

3-Busca el widget que dice “HTML-Javascript” y ábrelo

4-Coloca el siguiente codigo en el interior

El resultado serán dos íconos con los que se podrá manipular el tamaño de la fuente de texto, puedes ver el ejemplo funcionando de ambos métodos en este blog de pruebas.
Los íconos puedes cambiarlos por los tuyos si así lo deseas, sólo cambia la URL de la imagen, o bien, puedes usar sólo texto, si este es el caso entonces usa esto:

original cambia todo el Bloc

<a href="javascript:ts('body',1)">Aumentar fuente</a>
<a href="javascript:ts('body',-1)">Disminuir fuente</a>

cambia solo la entrada

<a href="javascript:ts('main',1)">Aumentar fuente</a>
<a href="javascript:ts('main',-1)">Disminuir fuente</a>

Este truco hará que cambie el tamaño de la letra de todo el blog, si deseas que sólo cambie la letra de las entradas cambia donde dice body por main.