Pasos para añadir fuente de iconos a WordPress

Pasos para añadir fuentes de iconos a WordPress
Pasos para añadir fuentes de iconos a WordPress

Si estás buscando añadir fuentes de iconos a tu página web de WordPress y no sabes cómo hacerlo, has llegado a la entrada indicada ya que te explicaremos cómo hacerlo de forma rápida y sencilla.

En tal sentido, agregar iconos como una fuente en vez de imagen, hace más práctico y atractivo tu sitio web. Ya que al elaborar una página se optimiza el proceso al añadir fuente de iconos.

(También te puede interesar: Conoce cinco trucos ocultos que puedes ejecutar con el fichero wp-config.php)

Por lo tanto, presta atención a los siguientes pasos para añadir y usar fuentes de iconos en tu página de WordPress.

Cómo añadir fuentes de iconos a WordPress

1- Descargar e instalar la fuente

En primer lugar, emplearemos FontAwesome para la fuente, y desde la página realizaremos la descarga para visualizar los iconos contenidos. Posteriormente, descomprime el archivo y emplea la carpeta cs y Font.

Luego copia las carpetas en el tema de WP que estés usando. En caso de tener la carpeta CSS, solo deberás copiar los documentos. Ahora, para realizar la integración a la web, se usará el archivo font-awesome.min.css.

Pasos para añadir fuente de iconos a WordPress
Pasos para añadir fuentes de iconos a WordPress

Además, se implementará el siguiente código para la referencia del archivo que se insertará en functions.php

  1. add_action( ‘wp_enqueue_scripts’, ‘fonts_style_sheet’ );
  2. function fonts_style_sheet(){
  3. wp_enqueue_style( ‘custom-stylesheet’, get_stylesheet_directory_uri() . ‘/css/font-
  4. awesome.min.css’);
  5. }

2 – Emplear iconos con clases

Después de comprobar el archivo font-awesome.min.css se verificará el código de fuente de la web. En tal sentido ya se puede emplear los iconos en las entradas o widget de texto con HTML.

3 – Emplear iconos con propias clases

En caso de querer iconos en otras áreas de la web que no admita HTML, se empleará CSS. Por lo tanto, para añadir iconos en los títulos de los widgets, se deberá insertar el siguiente código en archivo CSS.

  1. .widgettitle:before{
  2. font-family: “FontAwesome”;
  3. content:”\f005″;
  4. margin-right: 10px;
  5. }

También te puede interesar:

Verifica si los plugins de tu web son compatibles con PHP