Font Awesome es una compilación de iconos en formato vectorial que se puede personalizar a través de CSS para cambiar el tamaño , el color, añadir sombras , ajustar la opacidad , etc. Estaban originalmente diseñados para Twitter Bootstrap, la fuente esta disponible para el uso en cualquier proyecto.
Estos iconos tienen menos problemas de compatibilidad ya que no utilizan JavaScript. Se ven muy bien en pantallas de «Retina Display» porque al ser vectores se pueden escalar a cualquier pantalla.
Muchas de las plantillas de WordPress incluyen estos iconos y los podemos utilizar sin tener que instalar nada, también se puede instalar un plugin (Font Awesome 4 Menus) si tu plantilla no incluye estos iconos.
Paso 1: Añadimos la clase CSS del icono a nuestro menú.
Elegimos el menú a editar, en el cuadro de «Etiqueta de Navegación» pondríamos algo como <i class=»fa fa-home»></i> o <span class=»fa fa-home»></span> y el texto que queramos.
La clase CSS de los iconos la podemos encontrar en Font Awesome Icons. Una vez hemos terminado guardamos y si todo ha salido bien tendemos un menú con iconos.
Un ejemplo del resultado.
Además de utilizarlos en menús se pueden utilizar en WordPress al crear páginas o entradas pegando el mismo código que hemos utilizando en el menú utilizando la etiqueta <code> seguido de <i class=»fa fa-home»></i> o <span class=»fa fa-home»></span>.
