Instala Google web fonts en Wordpress

Diseño Web, Html, Personalización Dejar un comentario

Poder usar cualquier tipo de letra en el diseño de una web es un sueño, que durante muchos años no se ha podido realizar. Los diseñadores estaban supeditados a las tipografías estándar, que cualquier sistema operativo tenia instalado por defecto.

Como mucho, se podía elegir una familia de fuentes de letra, para que en el caso de no estar instalada la letra elegida, en el equipo que visitaba nuestro sitio, se diesen alternativas al navegador antes de cargar la fuente predeterminada.

Google web fonts

Con Google web fonts se ha revolucionado la web, conquistando el último eslabón que le faltaba al diseño en la web. La herramienta de Google lo ofrece todo, las fuentes de letra, el API y el entorno para obtener el código para embeberlo en tu web (aquí puedes ver un ejemplo).

fontific

Si tu sitio web está gestionado con Wordpress, tienes una gran variedad de plugins que permiten administrar el uso de las fuentes de letra de google en el cms. Uno de los mejores, a mi juicio, gratuito, sin publicidad y que facilita la integración de Google web fonts con Wordpress, sin tener que introducir código HTML en la plantilla del diseño, es Fontic.

fontic

Una vez descargado e instalado el plugin, solo hay que personalizarlo con las fuentes de letra y las características deseadas (tamaño, color, separación de lineas, palabras o letra). Definir el nombre del selector (que empiece por un punto, en el ejemplo puedes ver que se usa .f1) que posteriormente se usará en la entrada (post) o en la página del blog.

Google web fonts

Desde la pestaña html del post o página se define la capa con el nombre del selector de clase definido en las opciones de configuración para hacer la llamada a la letra y características definidas. En el ejemplo se llamaría al selector .f1 de la siguiente manera:

div class

De esta forma se pueden utilizar todos los selectores que se quieran, dentro de un mismo post o página, definidos en las opciones de fontic.

Blog Widget by LinkWithin
¿Te gustó?, VOTA el post. SÍGUEME por Twitter, Facebook o RSS.

Sigue leyendo:

2 Trackbacks

4 Comentarios

  1. Gravatar 15 septiembre 2011, 18:26
    posicionamiento internet: Reply to this comment

    La verdad es que es una herramienta sencilla y completa sobre todo para aquellos usuarios que desconocen tecnicas de diseño web.

  2. Gravatar 2 octubre 2011, 20:00
    DoctorPC: Reply to this comment

    Me mantengo fiel a Arial, Verdana =P

  3. Gravatar 17 marzo 2012, 16:36
    blogger: Reply to this comment

    gracias por esta información muy útil

  4. Gravatar 22 septiembre 2012, 9:54
    fer: Reply to this comment

    Gracias por enseñar este plugins para wp. Muy interesante, para poder tener tranquilidad en como se verán otras fuentes por ejemplo en blog infantiles o de una temática concreta, pero investigado tus enlaces, el pluging no se llama fontic, es fontific.
    Un saludo y gracias por compartir conociemientos.

Escribe tu comentario o... ¡salta!

Etiquetas XHTML permitidas: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>


Entradas RSS Comentarios RSS Acceder Subir
twitter facebook Rss mail rssSígueme en Google Currents