Tutorial:Cómo personaliza las fuentes de nuestro blog con Google Fonts
¡Hola amig@s!En el tutorial de hoy vamos ha hablar sobre como cambiar las fuentes de nuestro blog,usando la pagina Web de Google Fonts,para darle un aspecto personal y más bonito a nuestro blog.
Google Fonts dispone de un montón de fuentes gratuitas para tu blog,más de 800,así que empecemos:
1.Entramos en la pagina de Google Fonts y elegim la tipografía que más nos guste, y entonces hacemos click sobre el botón rosa
,situado arriba de cada letra.
3.Lo primero que que tenéis que hacer es una copia de seguridad de la plantilla(Plantilla→Crear/Restablecer copia de seguridad).
<link href="https://fonts.googleapis.com/css?family=Jomhuria" rel="stylesheet">type='text/css'/>
Y Ahí copiamos el código el último código,según el lugar dónde lo queramos poner,por ejemplo:
Si lo que queremos es usar la letra para todo el blog ,el código que tienes que poner en el css es el siguiente:
body {
font-family: ‘Jomhuria’;
Para cambiar la letra de la cabecera usaríamos el siguiente:
.header h1 {
font-family: ‘Jomhuria’;
}
Para cambiar el tipo de letra de los posts usaríamos el siguiente:
.post-body {
font-family: ‘Jomhuria’;
}
*(El código que esta en rojo, es el nombre de la tipografía.)
Google Fonts dispone de un montón de fuentes gratuitas para tu blog,más de 800,así que empecemos:
1.Entramos en la pagina de Google Fonts y elegim la tipografía que más nos guste, y entonces hacemos click sobre el botón rosa
,situado arriba de cada letra.
2. Después le damos a un cartel que aparecerá debajo de página que dice "Family select":
Y se nos desplegara la siguiente ventana:
Y de ahi copiaremos los dos códigos que están subrayados en gris claro en un blog de notas para después añadirlos a nuestro blog.
4.Entramos en → plantilla→Editar Html y buscamos (Pulsando Ctrl+F):
<head> y pegamos justo debajo de ella el primer código y añadimos al final del código un / que hará de cierre(sino no funcionara).Así:
5.Guardamos la plantilla.
6.El segundo código nos sirve para personaliza la fuente de los posts,la cabecera o el título de las entradas etc.. para ello nos vamos a:
Diseño → Personalizar → Avanzado → Añadir CSS.
Si lo que queremos es usar la letra para todo el blog ,el código que tienes que poner en el css es el siguiente:
body {
font-family: ‘Jomhuria’;
}
Para cambiar la letra de la cabecera usaríamos el siguiente:
.header h1 {
font-family: ‘Jomhuria’;
}
Para cambiar el tipo de letra de los posts usaríamos el siguiente:
.post-body {
font-family: ‘Jomhuria’;
}
*(El código que esta en rojo, es el nombre de la tipografía.)
Comentarios
Publicar un comentario