Cuando nos paseamos por blogs nos damos cuenta al instante de lo cómodo, o incómodo, que nos resulta pasar un rato leyéndolo. Quizás no nos preguntamos porqué, pero notamos que en ciertos blogs estamos más cómodas/os que en otros. Una de las razones principales es por el tipo de letra que se usa para redactar las entradas. Por ello instalar fuentes en Blogger es algo que debemos aprender a realizar si queremos que el diseño sea armónico y a nuestro completo gusto.

¡¡Inciso!! ¡Al final del post hay regalo! 🙂

Digamos que si nos encontramos tipografías un tanto ilegibles y difíciles de entender, nos cansaremos visualmente y como no nos interese muchísimo la información, nos iremos pronto de ese blog.   

Pues eso mismo le ocurre a tus lectores/as así que debemos tener en cuenta esto , siempre, para elegir un tipo de letra para nuestro blog.

El diseño de nuestra Web, o nuestro blog, es muy importante para que nuestra audiencia se quede, vuelva, repita… Si no lo tenemos cuidado puede afectar de manera muy negativa.

La necesidad de personalizar nuestra web o blog

Blogger nos ofrece bastantes tipos de letra para usar en nuestro blog y en nuestras entradas, y ciertamente muchas de ellas nos servirían perfectamente para crear una fácil lectura y crear una redacción bonita.

Pero a veces nuestra Identidad de Marca consta de alguna tipografía que no encontramos en la plataforma Blogger. Por eso hoy os traigo este tutorial, para que puedas elegir el tipo de letra que quieras para personalizar más todavía tu blog.  

Estos tipos de letra que nos vamos a instalar, no solo sirven para nuestros post/entradas, si no que también los podemos usar en los títulos de entradas y sidebar(gadgets de la barra lateral) y esto es ya un punto y aparte en la personalización de nuestro blog porque es una forma importante de acentuar nuestro estilo y personalización.  

Si ya conoces mi curso para crear y diseñar tu blog desde cero en varias clases podrás descubrir que tras instalar estas fuentes, podrás modificar tus fuentes donde aparezca lo siguiente;

font-family: 

Ya que ese código es el que define el tipo de letra de aquel «apartado» o sección que queramos personalizar. Puedes usar estas tipografías en todos los lugares que quieras, simplemente añadiendo el CSS (código de estilo) que te proporciona la fuente que instales.  

Vamos a empezar con la parte práctica ya, porque me podría pasar largo rato hablando sobre tipografías en tu blog, pero lo vamos a dejar para otro post.

Instalar fuentes externas o personalizadas en Blogger

Para esta opción, una de las más reveladoras del momento, contamos con la colaboración de Dani de zkreations, que ha desarrollado el tutorial. ¿Sabes que no existe un tutorial actualizado para lograr este propósito de instalar la fuente que quieras en Blogger? Pues por eso Dani y yo hemos querido crearlo y ponértelo super fácil.

Con los conocimientos avanzados y profesionales de zkreations y mi dinamismo para explicar los tutoriales aquí te mostramos una forma super fácil para poder usar en tu blog el tipo de letra que más te guste.

Si quieres tipografías bonitas puedes echar un ojo al post 15 Tipografías bonitas de uso libre y personal + Instalacion.

Aquí te dejo el tutorial paso a paso de zkreations para instalar fuentes web en blogger de forma gratis sin necesidad de hosting

Tienes que ver el vídeo junto a su tutorial para que no cometas ningún error. ¡Ánimo! ¡¡Podrás usar la fuente que quieras en tu blog!!

Cualquier duda nos la dejas en comentarios.

Instalar fuentes de Google Fonts en Blogger

Te lo voy a explicar paso a paso, como de costumbre, y con un vídeo, así que no tengas miedo, vé paso a paso y quedará tal como quieres.  

1. Vamos a la página de Google.com/fonts
2. Elegimos las tipografías que nos gusten, y cuando veamos alguna que nos interesa de verdad
3. Le damos al icono de «más», pero te aconsejo no elegir demasiadas.   

Ya sabes que menos es más. Aunque al principio quizás quieras, o tengas, que probar varias, al final es mejor quedarse con las que realmente vas a usar, para no llenar la plantilla de código innecesario porque será perjudicial para nuestro blog.  

4. Una vez que tengas tus tipografías elegidas vamos a darle a donde te muestro en la imagen, que está aquí, mira:    

y entonces se despliega el lugar donde puedes elegir las variaciones de cada tipografía que puedes elegir en CUSTOMIZE (nº2 de la siguiente imagen), y los códigos que necesitamos en EMBED (nº1 de la siguiente imagen).

Realmente en CUSTOMIZE te aconsejo seleccionar solo las clásicas: Bold (700) , Normal Italic (400)  y Normal (400)

5. Una vez que las tenemos seleccionadas toca copiar el código que te facilita Google/fonts en EMBED font- STANDARD

6. y ahora nos vamos al blog:  
7. Tema
8. Copia de seguridad (en los puntitos, luego en Copia de seguridad y luego Descargar)

9. Buscamos en plantilla este código (si no sabes como mira este vídeo)

</head>

10. y justo antes pegamos el código que hemos copiado en Google/fonts.

11. Guardar Plantilla y listo, ya podremos usar nuestros nuevos tipos de letra.

Cambia las fuentes en Blogger

Para poder usarlo como he dicho antes, podrás modificar las partes de tu plantilla donde encuentres:

font-family:

y tendrás que poner el código que Google/fonts te facilita , nº 4 de la imagen que te he compartido más arriba.  

Esos serán los códigos que tendrás que usar para modificar el tipo de letra de aquella parte de tu blog que prefieras. En mi caso aparecen 2 porque son las que he elegido, pero en tu caso aparecerán las que tu escogieras.     

Un detalle a tener en cuenta es que podrás cambiar la tipografía de todas tus entradas por defecto, pero dentro de ellas no tendrás una opción sencilla,  en el editor de entradas, donde puedas elegir tus tipografías, así que, quizás sea complejo en un mismo posts cambiar de tipografía varias veces.   

Para esto deberías entrar en la parte HTML de tu editor de entradas y cambiar la parte font-family: … por aquella que hayas instalado de Google/fonts con el código del apartado 4 de la última imagen que te he compartido. No te lo recomiendo, más bien te recomiendo que crees un texto citado por defecto, con otro tipo de letra u otro estilo (CSS ya personalizado en tu plantilla, lo veremos en la clase número 13) 

Cambiar la tipografía de todas tus entradas 

1. Buscar en tu plantilla HTML el siguiente código   (si no sabes cómo mira este vídeo aunque la visual es distinta se hace completamente igual)

.post-body {

2.  y después pegar el código que google/fonts te comparte en ese apartado número 4 (imagen anterior)

3. Guardar Plantilla y Ver blog.    

Te explico todo con detalle en el vídeo, para que no se te pase nada y te resulte todo más dinámico y sencillo 🙂

Espero que os haya gustado, creo que os encantará porque es muy útil este tutorial y seguro que ya teníais ganas. Además saber cómo solucionar esos problemillas e impedimentos que Google nos ha creado, nos ayuda a superar pequeñas frustraciones.

Por cierto que espero que me comentes algunas sugerencias para posts futuros, ya tengo unos cuantos preparados muy útiles gracias a vuestras sugerencias 🙂

Regalo planificador descargable

Os comento que si os gustan los organizadores semanales he diseñado uno.

Para descargarlo puedes usar los botones debajo de la imagen a continuación.

¡Espero que te gusten!