,

Como añadir Font Awesome a WordPress sin un plugin

Hay varios plugins que permiten añadir Font Awesome a WordPress pero realmente es muy sencillo añadirlo sin necesidad de ningún plugin y podemos utilizar un CDN que permite que se cargue mucho más rápido en nuestra página y por lo tanto aumenta la velocidad a nuestros usuarios.

En caso de que no lo sepas Font Awesome es una fuente de iconos de la gente que está detrás de Bootstrap de Twitter, lo que nos da son iconos vectoriales escalables y que son una letra más en nuestro diseño, por lo que podemos darle color, sombra y todo lo que pueda hacerse con una letra con CSS.

En esta oportunidad veremos como utilizarlo con el CDN de NetDNA llamado BootsrapCDN para hacerlo debemos abrir el archivo de functions.php del tema que estamos utilizando estará normalmente en la carpeta wp-content/themes/nuestro_tema dentro de WordPress

<?php
add_action( 'wp_enqueue_scripts', 'incluir_cdn_font_awesome' );
/**
* Registra y carga font awesome
* CSS files using a CDN.
*
* @link http://www.bootstrapcdn.com/#tab_fontawesome
* @author Media Recursos
*/
function incluir_cdn_font_awesome() {
  wp_enqueue_style( 'incluir_cdn_font_awesome', '//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css', array(), '3.2.1' );
}

El <?php del principio no hace falta si ya tu functions.php tiene este tag abierto solo incluye lo que está después del <?php al final del archivo después de la ultima línea.
Si quieres saber más de la funcion wp_enqueue_style de WordPress puedes verla en el Codex

Hay también un estilo para soportar IE7 lo puedes ver en la página de bootstrapcdn.

Eso es todo ahora puedes utilizar cualquiera de los 361 iconos hasta la fecha simplemente agregando el siguiente código en cualquiera de tus post y cambiando obviamente el class según el icono que quieras:

<i class="icon-check-sign"></i> 

y esto nos muestra el siguiente ícono estos iconos los puedes utilizar en botones, textos, menus y en cualquier otro sitio donde utilices letras, sin la necesidad de tener imagenes y lo mejor de todo es que le puedes colocar el estilo que quieras con CSS en nuestro WordPress.

Puedes ver todos una lista de todos los iconos que puedes utilizar aqui.

Muy sencillo y fácil de utilizar, pronto seguiremos publicando más recursos y tutoriales.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *