Como podemos cambiar la tipografÃa de nuestro blog fácilmente, usando Google Fonts.
Disponen de un montón de tipografÃas y muy facÃl de usar.
Lo primero que tenemos que hacer es irnos a la página de Google Fonts
Una vez estemos dentro elegimos la tipografÃa que queremos poner en nuestra página.
Elegimos la tipografÃa y le damos al botón de la parte derecha de la pantalla, + Select this font.
Se nos abrirá otra ventana de esta forma.
Tenemos que seleccionar el primer código qe lo añadiremos a nuestra plantilla HTML:
Para ello nos vamos a Plantilla > Editar HTML
Como siempre digo antes de tocar nuestra plantilla, lo menor es que hagamos una copia de seguridad de la misma, para recuperarla en todo momento.
Aquà dejo el link parahacer una copia de seguridad de nuestra plantilla paso a paso.
Como comentaba dentro de nuestra plantilla HTML, buscamos con Cttrl + F <head> , que lo vamos a encontrar al principio de la plantilla.
Ahora justo antes pegamos el código que nos ha ofrecido google Fonts.
SerÃa más o menos asÃ.
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"/>
En este caso yo el tipo de tipografÃa que he elegÃdo es . Open Sans.
Como veréÃs no tiene el cierre del código por lo que lo tenemos que cerrar como lo marcamos en color azul.
Ahora ya que lo tenemos metido en nuestra plantilla tenemos que irnos ha hacer unos cambios en el CSS.
Ahora tenemos que integrar el siguiente código según preferencias.
font-family: 'Open Sans', sans-serif;
Ahora nos vamos a Plantilla > Personalizar > Avanzado > Añadir CSS.
En el recuadro añadiremos el código según queramos cambiar partes de nuestra página.
Por ejemplo para cambiar el tÃtulo de nuestros post.
SerÃa asÃ:
h3.
post-title {font-family: 'Open Sans', sans-serif;}
post-title {font-family: 'Open Sans', sans-serif;}
Si lo que queremos es cambiar la tipografÃa de todo nuestra página serÃa este:
body {font-family: 'Open Sans', sans-serif;}
Para cambiar el tipo de letra de la cabecera hay que usar el siguiente:
.header h1 {font-family: 'Open Sans', sans-serif;}
y para cambiar el cuerpo de nuestras entradas usaremos este:
.post-body {font-family: 'Open Sans', sans-serif;}
Fácil verdad..
Espero que hos alla servido te post.
Imprimir entrada