Cambiar la fuente del título de las entradas

Sí, ya sé que Blogger tiene un montón de fuentes predeterminadas entre las que elegir… ¡pero es que hay algunas fuentes monísimas que podemos usar para nuestros títulos! Pero no están en Blogger, sino en Google Fonts, ¡echadle un ojo! Os van a encantar.
Así que hoy vamos a ver como instalar una fuente de Google Fonts en Blogger para que el título de nuestras entradas sea más bonito y combine con la estética de nuestro blog. ¡Es muy sencillo!

1.- Entramos en Google Fonts (desde el enlace que os puse más arriba)

Cambiar la fuente del título de las entradas

2.- Podemos ir pasando páginas hasta ver las más de 600 fuentes que podemos instalar… o usar el buscador para acotar nuestra búsqueda.

En All Categories podéis elegir el tipo de fuente.

Si os interesa conocer la diferencia entre los diferentes tipos de fuentes (Serif, Sans Serif , Display y Handwritting) podéis leer este artículo, lo explica muy bien y es la mar de interesante (yo es que soy curiosa por naturaleza).

3.- Os voy a enumerar algunas que podéis buscar usando el buscador, son de las que más me gustan:

Annie Use Your Telescope

4.- Raleway (está es genial, muy fina y elegante)

5.- Amatic SC, ¡Super original! Podéis verla funcionando en el Blog de Mariam; Lunares Grises.

6.- Josefin Sans. Me gusta mucho por lo fina que es.

* Para mis títulos he elegido la Patrick Hand SC. También podéis buscarla si os gusta.

7.- Cuando encontremos una que le vaya bien a la estética de nuestro blog pulsamos en Add to Collection, a la derecha del tipo de letra elegida.

8.- Abajo nos aparecerá una pestaña gris llamada Collection con el número de fuentes que tenemos guardadas. Para empezar con la instalación en Blogger pinchamos en Use, a la derecha.

9.- En la siguiente ventana verificamos que esa es la fuente que queremos.

10.- Nos aseguramos de tener marcado Latín.

11.- Y llegamos al primer código que tenemos que insertar en nuestra plantilla HTML.

Copiarlo en word y añadir una barra al final, justo antes de >.

Quedaría así:

type=’text/css’/>

Si no lo hacéis, no funcionará.

12.- Abrimos nuestra plantilla HTML una vez tengamos nuestro código modificado y buscamos </head> (Ya sabéis, para abrir el buscador interno, pincháis en cualquier punto de la plantilla y pulsáis simultáneamente Ctrl + F)

13.- Pegamos nuestro código modificado justo encima de </head>. Comprobad en Vista Previa que no os vuelca error en la plantilla. Si os sale error, comprobad que habéis modificado el código bien, como vimos en el paso 11 y que se ve igual que el mío, que es éste:

¿Véis? La barra (/) justo al final, antes de >. Es muy importante.

14.- Volvemos a Google Fonts para copiar el siguiente código en la parte del CSS de nuestro blog (ahora vemos donde)

15.-  El código que vamos a usar es:

.post h3 {
(aqui el código que habéis copiado de Google Fonts)
font-size: 25px;
}

En la parte roja ponéis el segundo código de Google Fonts, en mi caso:

font-family: ‘Patrick Hand SC’, cursive;

Y en la parte verde, el número antes de px, indica el tamaño de la letra. Cuando la tengamos instalada en el Blog, en Vista Previa, podemos ir viendo que tamaño queda mejor.

Una vez modificado nuestro código, lo pegamos en nuestra plantilla HTML.

Justo antes de ]]></b:skin>, como en la siguiente imagen:

Pulsamos Vista Previa para comprobar que no hay errores y podemos ir modificando el tamaño de la letra hasta que quede como queremos.

16.- ¡Y éste es el resultado!

* El color ya sabéis que se modifica en Plantilla –> Personalizar –> (Diseñador de Plantillas) –> Avanzado –> Enlaces. Los títulos de nuestras entradas son simples enlaces, así que podéis cambiar ahí el color, pero se cambiará el de todos los enlaces que tengáis, tanto en las entradas como en el sidebar.

¡Ya me contáis que fuente habéis instalado! Hay para todos los gustos, así que seguro que encontráis una que quede perfecta en vuestro blog.

¿QUIERES APRENDER A DISEÑAR BLOGS PROFESIONALES EN BLOGGER?
¡CON UN MONTÓN DE PLANTILLAS Y MANUALES PARA PRACTICAR!
ECHA UN VISTAZO A MI PROGRAMA DISEÑA EL BLOG DE TUS SUEÑOS: 


SI QUIERES QUE DISEÑEMOS EL BLOG DE TUS SUEÑOS JUNTAS



Suscríbete a mis entradas por email ¡para no perderte nada!

♥ Las recibirás en tu bandeja de entrada el mismo día que sean publicadas ♥

Te encantará:

The following two tabs change content below.

Celia

Diseñadora, Mentora y Formadora Online at El Perro de Papel
Mamá y emprendedora a tiempo completo. Ayudo a otras mujeres y madres soñadoras a emprender un negocio online de éxito para conciliar su vida personal y profesional.Si este artículo te ha gustado, sigue aprendiendo conmigo en mi reto gratis de 14 días para conectar con tu mejor versión CLICK AQUÍ.Y AQUÍ tienes mi curso premium para mamás emprendedoras que quieren hacer realidad su idea genial, mano a mano, conmigo.¡Que tengas un feliz día, soñadora!

¿CANSADA DE TRABAJAR TANTAS HORAS SIN VER LOS RESULTADOS ESPERADOS?

Te regalo mi CURSO GRATIS DE 5 DÍAS para mamás emprendedoras que quieren conciliar su vida personal y profesional sin volverse locas ni renunciar a sus sueños.

¡Bienvenida! Ahora revisa tu correo ;)

Pin It on Pinterest

Share This