Cómo instalar fuentes de Google Fonts en tu plantilla blogger

martes, 19 de mayo de 2015


Hola artistas! Seguimos con los tutoriales sobre la personalización de nuestro blog. Esta vez os voy a hablar sobre cómo instalar una tipografia que te guste de Google Fonts en tu plantilla blogger.

Es muy fácil, esta vez no os voy a marear mucho ;)



Primero de todo nos vamos a Google Fonts:



Imagina que te has enamorado locamente de la fuente Merriweather y la quieres tener en tu blog sí o sí.

Pues lo único que tienes que hacer es buscarla en Google Fonts (1), clicar en "Add to Collections" (2) y darle a "Use"(3).

Después nos saltará a una página dónde nos da el código HTML y también el CSS de nuestra tipografía soñada.


Ahora es cuando tienes que copiar el primer código (el HTML) en tu plantilla de blogger. Para ello tienes que ir a Plantilla ➡ Editar HTML y buscar <head> pulsando CTRL+F (en caso de que tengas Windows) o CMD + F (en caso de que tengas un Mac). 

 

IMPORTANTE: el código que te da Google Fonts está incompleto, debéis añadir / antes del símbolo >, de forma que quede así: /> para cerrar el código correctamente.

Ya tienes el código instalado. Ahora sólo te queda añadir el segundo código que te proporciona Google Fonts (el código CSS) donde quieras que se vea tu nueva fuente.


* Si quieres que sea la fuente general de tu blog, vete a Plantilla ➡ Editar HTML y busca body {. Allí sustituye la fuente que tengas por font-family: 'Merriweather', serif;

De modo que quede así:












* Si quieres que sea la fuente de los títulos de tu post, vete a Plantilla ➡ Editar HTML y busca /* Posts. Y sustituye la fuente que tengas por font-family: 'Merriweather', serif; de nuevo:











Y esto ha sido todo por hoy... ¿te ha gustado el tutorial? Espero que te haya sido útil!


Así que ya sabes, si te ha servido me encantaría que lo compartieras con tus redes, un abrazo fuerte!! 


Laia

2 comentarios:

  1. ¡Hola! Muchas gracias por el post. Tengo una duda, seguí todos los pasos pero mis entradas tienen la misma fuente.

    ResponderEliminar
  2. ¡Hola! Muchas gracias por el post. Tengo una duda, seguí todos los pasos pero mis entradas tienen la misma fuente.

    ResponderEliminar