¡Hola a tod@s! Para que podáis seguir personalizando vuestro blog esta semana voy a enseñaros como instalar una tipografía o fuente desde Google Fonts. De esta manera no tendréis usar si no queréis las fuentes que vienen ya en Blogger por defecto.
Obviamente Google Fonts no tiene todas y cada una de las fuentes del mundo, pero si una gran variedad de ellas, y lo mejor es que podéis instalar todas las que queráis a la vez.
También vamos a daros algunos ejemplos con las fuentes que usamos nosotras, así que ¡vamos a empezar!
Lo primero que hay que hacer es seleccionar la fuente que nos guste en Google Fonts. Nosotras ahora mismo tenemos dos más sencillas, simples y fáciles de leer para el cuerpo de las entradas y dos más "especiales" y recargadas para títulos.
COMFORTAA
Esta fuente queda así.
ESTA FUENTE QUEDA ASI.
MONTSERRAT
Esta fuente queda así.
ESTA FUENTE QUEDA ASI.
LOBSTER
Esta fuente queda así.
ESTA FUENTE QUEDA ASI.
PACIFICO
Esta fuente queda así.
ESTA FUENTE QUEDA ASI.
Ahora vamos a empezar la parte de instalar la tipografía.
Cuando ya tengáis una elegida pinchad donde indica la imagen.
Después os redireccionará a otra página y si bajáis un poco os saldrá esto;
Lo que tenéis que hacer ahora es copiar el código para HTML y abrir la plantilla de vuestro blog (recordad siempre que antes de cambiar nada hay que hacer copia de seguridad), pero aún no cerréis esa página.
Para esto id a vuestro menú de blogger > Plantilla > Editar HTML y cuando se os cargue pulsad ctrl+F y en la barra de buscar tenéis que poner <head>.
Y justo debajo pegad el código que habéis copiado de la página de Google Fonts, pero al final tenéis que poner un / entre ' y >. Y ya podéis guardar esa plantilla.
Ahora para dar uso a las letras hay que ir al menú de blogger > Plantilla > Personalizar > Avanzado > Añadir CSS y os aparecerá esto:
Entonces ahora depende de para lo que queráis usar el tipo de letra ahí tendréis que escribir una cosa u otra. Estas son las opciones:
body { /* Cambia la fuente del cuerpo (entradas, links y gadgets del blog)*/
font-family: 'Pacifico', cursive;
}
h3.post-title { /* Cambia la fuente de las entradas*/
font-family: 'Pacifico', cursive;
}
.widget .title { /* Cambia la fuente de los gadgets*/
font-family: 'Pacifico', cursive;
}
Lo que está en diferente color es el segundo código que nos ha salido en la página de Google Fonts, entonces ahí cada uno tendréis que pegar correspondiente a la fuente que tengáis elegida.
Y ya está. Yo creo que ha sido muy fácil pero si tenéis problema al instalar cualquier cosa decídnoslo en los comentarios e intentaremos ayudaros.
CREDITOS DEL POST
Autor: Maria C. Diaz
Encuéntrame en: Twitter // Tumblr // Instagram
No hay comentarios:
Publicar un comentario