Cómo agregar maravillosos iconos de fuentes a WordPress: 3 métodos simples

¿Le gustaría agregar iconos increíbles a WordPress? Los iconos impresionantes de la fuente son geniales (¡sic!) Porque, a diferencia de las imágenes ordinarias:
Puede cambiarles el tamaño sin pérdidas de calidad, porque son vectores.
Soy muy fácil de personalizar: puede cambiar las dimensiones, agregar animación, poner un borde y más.
En este punto, Font Awesome incluye más de 2,986 íconos diferentes. Y le mostraré 3 formas en que puede comenzar a usar en su sitio de WordPress. En primer lugar, aprenderá un método manual simple que puede usar para agregar Font Awesome.
Luego aprenderá cómo puede usar 2 complementos diferentes para lograr casi lo mismo. Si ciertamente sabe que desea usar un complemento, haga clic aquí para moverse directamente a esa sección. De lo contrario, ¡comencemos con el método manual! Cómo agregar manualmente maravillosos iconos de fuentes a WordPress para agregar manualmente iconos increíbles a WordPress, todo lo que tiene que hacer es poner una hoja de estilo en su WordPress. Suena complicado, ¿verdad? No, no te preocupes. Es súper fácil, te lo mostraré. La única desventaja de este método es que tendrá que actualizar manualmente la URL de la hoja de estilo si siempre desea usar la última versión increíble.
Cómo colocar una hoja de estilo de fuente increíble en WordPress en la cola para poner en la hoja de fuente de la cola, solo tiene que agregar un fragmento de código corto a las funciones.php del tema del niño o mediante un complemento como el complemento de fragmentos de código gratuito .. Siempre recomiendo a las personas que usen el complemento de fragmentos de código para administrar funciones.php, por lo que lo haré para este tutorial. Pero es perfecto para agregar esto directamente a las funciones.php de su base siempre que use un tema infantil. El artículo continúa a continuación

Aquí está el fragmento que necesita agregar:
add_action (‘wp_enqueue_scripts’, ‘enqueue_load_fa’); Función enqueue_load_fa () {wp_enqueue_style (‘load-fa’, ‘https://use.fontawesome.com/releases/v5.0.13/css/all.css’); } ¿Hay una advertencia? ¿Ves la URL? Es decir: https://use.fontawesome.com/releases/v5.0.13/css/all.css. Esta es la versión actual de Font Awesome mientras escribe esta publicación. Pero debido a que probablemente leerá esta publicación en el futuro, debe acceder a Font Awesome y obtener el último enlace. Aunque puede descargar Font Awesome y alojarlo usted mismo a través de la misma URL, es más fácil para la mayoría de las personas usar solo el CDN gratuito.
Para agregar este código con fragmentos de código de complemento, vaya a fragmentos → nueva adición e inserte en:
Asegúrese de hacer clic en Guardar los cambios y activar en la parte inferior para activar el fragmento de código. ¡Y eso es! Acabas de agregar Font Awesome a WordPress. Cómo usar maravillosos iconos de fuentes en su contenido Ahora que ha puesto en la hoja de estilo, está listo para comenzar a usar iconos en su contenido. El artículo continúa a continuación

Para hacer eso:

Vaya al sitio web Font Awesome y use el cuadro de búsqueda para encontrar el icono que desea usar

En la página de carga, copie el fragmento de código en el icono
Agregue ese fragmento de código al lugar en su sitio de WordPress donde desea usar el icono. Asegúrese de usar la pestaña de texto si está utilizando el editor de WordPress.

Y aun así, deberías tener tu icono:

¡Ese ícono es tan pequeño, sin embargo! Reparemos esto … cómo aumentar los iconos con fuentes maravillosas (o cambiarlas de otras maneras) para manipular los increíbles iconos de fuentes, solo tiene que agregar algunos parámetros adicionales al código de icono que ha agregado al editor de WordPress.

Para ajustar las dimensiones, puede usar parámetros como:

Fa-xs-muy pequeño (.75 ​​em)
FA-2X-doja el tamaño (2 em)

Tamaño FA-3x-Triple (3 em)
y así
¡Puedes ir a FA-10X si quieres hacerlo realmente grande!
El artículo continúa a continuación
Entonces, aquí está el código que usó para triplicar el icono en el ejemplo anterior:

Y ahora es mucho más grande:

¿Guay, verdad? ¡Puede usar otros modificadores para hacer cosas como agregar borde, animar íconos, cambiar ángulos y más! Lea todo sobre ellos aquí. Entonces, listo, no es demasiado difícil agregar una fuente increíble a WordPress. Pero si está buscando una manera más fácil, aquí hay dos excelentes opciones de arado. Le mostré en la sección manual. Y también le brinda códigos cortos y una interfaz gráfica para introducir iconos impresionantes de fuentes mientras está en el editor de WordPress, lo cual es un gran beneficio si no le gusta trabajar directamente con el código. Para iniciar, instale y active el complemento. Luego puede comenzar a usar los iconos de inmediato.

Recibirá un nuevo botón de inserción de icono en el editor de WordPress:

Al hacer clic en él, se abrirá una interfaz en la que puede buscar en la biblioteca Awesome Font e introducir fácilmente los iconos:
Al seleccionar un icono, el complemento agregará un código corto al editor:
Para cambiar el tamaño del icono o manejarlo de otra manera, todo lo que tiene que hacer es agregar los mismos fragmentos cortos de la sección manual de esta guía para el aula. Por ejemplo, aquí le mostramos cómo multiplicar cuatro veces el tamaño de uno de sus iconos:

¡Fácil! Finalmente, el complemento incluye un área de configuración básica al que puede acceder accediendo a la configuración → Mejor fuente impresionante.

La mayoría de las veces, no tienes que cambiar nada aquí. Pero estas configuraciones son útiles si desea usar una determinada versión de Font Awesome, en lugar de usar siempre la última versión: Elementor si usa el generador de páginas (¡esto es lo que usamos aquí en Wplift!), Ya tiene iconos Font Awesome a través de la interfaz Elementor. Esto se debe a que Elementor usa Font Awesome para alimentar todas sus opciones de iconos. La forma más fácil de acceder a los iconos es simplemente usar el widget de iconos que está disponible en la versión gratuita de Elementor:

Pero Font Awesome Icons también aparecerá en otros widgets, como el cuadro de iconos o la lista de iconos. Estos dos últimos widgets son particularmente útiles, ya que facilitan el uso de iconos de manera interesante, sin tener que saber cómo codificar. Lea nuestra revisión elemental para obtener más razones por las que nos gusta Elementary. Así es como agrega maravillosos iconos de fuentes a WordPress aquí, tres formas diferentes en que puede agregar iconos increíbles a su sitio de WordPress. Si se siente cómodo con un poco de reparación, el enfoque manual siempre es una buena primera opción. Si no, Better Font Awesome hace casi lo mismo, solo en formato de complemento. Y si ya está usando Elementor, es posible que ni siquiera necesite ninguno de estos métodos, ¡porque Elementor ya tiene íconos impresionantes directos directamente incluidos! Ahora voy a ti, ¿cómo usas iconos increíbles en tu sitio web de WordPress? ¿Y cuál es tu método favorito para agregarlos?


Copyright statement: Unless otherwise noted, this article is Collected from the Internet, please keep the source of the article when reprinting.

Check Also

gkOVSBm5B8SgiXmo

Shopify vs WooCommerce – ¿Cuál es la mejor plataforma?(Comparación)

Shopify vs WooCommerce

Leave a Reply

Your email address will not be published. Required fields are marked *