Tutorial Google Fonts y Blogger

Tutorial de Blogger cambiar el tipo de letra .Foto de Miguel Á. Padriñán

Muchas veces al adquirir o descargar una plantilla de Blogger, puede suceder que no esté a gusto con el tipo de letra. La tipografía no es clara y legible. El diseño de la fuente dificulta la lectura y no se lee fácilmente desde el móvil. Este es un aspecto importante, que no se puede descuidar, el tipo de letra puede incentivar a los lectores a leer, ojear los artículos y publicaciones.

Pensando en este inconveniente, hemos redactado este artículo, en donde explicamos cómo personalizar las fuentes de Blogger. Utilizando una tipografía gratuita de Google Fonts. Hay otros artículos, que retoman esta temática. Sin embargo, en este post te explicaremos una alternativa fácil que te ayudara ahorrar tiempo.

¿Sabías que:

Las fuentes de Google fonts son gratuitas y de código abierto.
Se puede utilizar para fines comerciales. Revisar las condiciones de licencia.
Como son de código abierto y sin costo, se puede hacer logotipo con las fuentes.
Son ligeras no afectan la velocidad de carga de la página. No perjudica la experticia de los usuarios?

Escoge la fuente en Google Fonts

Primer Paso. Ingresa a la página de Google Fonts. Elige entre las 1105 fuentes de tipografía para darle un aspecto original a tu web. Realiza clic sobre la fuente que te gusto. Aparecerá un recuadro en la parte derecha. Revisa y copia el enlace de la fuente:

por ejemplo:

Código del enlace:

<enlace href="https: //fonts.googleapis.com/css2? familia= Lato:peso@900 &familia= Oswald:peso@200 &family= Shadows+Into+Light & display=swap" rel="stylesheet">

Copia el enlace y anota las reglas de CSS para especificar familias. Por ejemplo:

font-family: 'Oswald', sans-serif;

Algunas fuentes favoritas de Google Fonts

Te recomendamos utilizar la tipografía de Google Fonts, además de ser gratuitas. Se integran perfectamente al sitio web. Al no afectar la velocidad de la página son seguras y ayudan al rendimiento. Se encuentran diversos diseños elaborados por expertos en tipografías.

Escoge una fuente para los títulos, subtítulos y párrafos.

Pasos para cambiar la tipografía en la plantilla de Blogger

Ahora que has escogido el tipo de letra y copiado el código del enlace, realiza los siguientes pasos para personalizar la fuente de tu plantilla.

1) Crea una copia de seguridad de la plantilla.

2) Ingresa a la edición HTLM de Blogger.

3) Presiona control + F. Busca el siguiente código: type='text/css.

4) Remplaza la fuente con el código del enlace que has copiado en Google Fonts. Por ejemplo:

<link href=' https: //fonts.googleapis.com/css2? familia= Lato:peso@900 &familia= Oswald:peso@200 &family= Shadows+Into+Light & display=swap" rel="stylesheet' type='text/css'/>

1 5) presiona control + F. Busca el siguiente código: font-family: (nombre de la fuente)

6) 6) Remplaza la fuente que aparece, por el nuevo tipo de letra, en este caso:

font-family: 'Oswald', sans-serif;

Anotación: Si vas a utilizar más de una fuente, revisa el siguiente código:

post-title: personaliza el título del post.
header h1: personaliza la tipografía de la cabecera.
.post-body: personaliza el tipo de letra de las entradas.

Sin embargo, en las plantillas de Blogger los nombres pueden tener una variación. Pueden contener un número o una palabra adicional delante de los mencionados nombres o códigos.

Truco para personalizar la fuente de Blogger

Sí, tu objetivo es personalizar la plantilla con una sola fuente. Este truco será de utilidad. Primero realiza, hasta el punto 4, de este tutorial: “Pasos para cambiar la tipografía de la plantilla en Blogger”. Una vez, pegues el enlace en la plantilla del código de la fuente, continua con el siguiente paso.

Ingresa a la edición HTLM de Blogger.
Presiona control + F. Busca el siguiente código: font-family:
Copia la familia de la fuente de tu plantilla en un blog de notas. Por ejemplo:

'Lato', sans-serif;

Presiona control + F. Busca en Blogger el siguiente código: </style>

Debe seleccionar todas las reglas de CSS de la plantilla desde donde empieza la etiqueta <style> hasta donde termina. </style>

Copia el código. Abre un archivo de Word y pega el código.

Busca la función para remplazar la secuencia de caracteres del texto de Word.

1) Se abre un formulario como este.

A continuación ingresa en "Buscar": el nombre de la fuente o tipo de letra de la plantilla original. En "Remplazar con:" escribe el nombre de la nueva fuente. Por ejemplo: 'Oswald', sans-serif;

Una vez haga los cambios de remplazo del nombre de la fuente en todo el texto de Word. Copia el código y pégalo dentro de la etiqueta <style> de la plantilla de Blogger. Guarda los cambios y recarga la plantilla.

Revisa el blog. Si todo salido bien, aparecerá la nueva fuente en cada una de los apartados de la página. Coméntanos: ¿Te funciono? escríbenos las dudas e inquietudes, la resolveremos lo más pronto posible.