Pregunta sobre Font Awesome de Wordpress:

Algunos iconos menos s贸lidos

Un usuario pregunt贸 馃憞

隆Hola!

La mayor铆a de los 铆conos dan como resultado la versi贸n s贸lida que usa unicode, como:

.li:before{
content: 'f502';
font-family:FontAwesome;
}

Esto es genial y lo que quiero. La 煤nica excepci贸n es, cuando trato de usar estos 铆conos: tarjeta de direcci贸n, libreta de direcciones y credencial de identificaci贸n, la versi贸n normal todos los clientes potenciales.

驴C贸mo puedo arreglar esto? Tratando de usar font-weight:900; la versi贸n s贸lida no resulta.

Gracias.

Este tema fue modificado hace 1 a帽o, 8 meses por.

(@mlwilkerson)

Hace 1 a帽o, 8 meses

Hola, aqu铆 hay algunas partes m贸viles diferentes. Entonces, dependiendo de lo que est茅 cargando realmente, la soluci贸n es diferente. Empezar茅 con algo de contexto.

1: 芦FontAwesome禄 es el nombre de fuente de la versi贸n 4. Si est谩 usando eso y mirando 铆conos mientras usa este plugin, es porque tambi茅n est谩 cargando la versi贸n 4 (de alg煤n otro tema o plugin de escenario muy com煤n en WordPress world), o tiene la compatibilidad v4 habilitada con este plugin.

2: Cuando lanzamos la versi贸n 5, la mayor铆a de los 铆conos v4 se asignaron al estilo Solid en v5. Pero hay un conjunto de ellos que se asigna al estilo Regular, que incluye todo lo que enumer贸 (p. Ej. address-card). Usted puede lista completa aqu铆.

3: est谩s usando Elementos de CSS simulado para referirse a esos iconos (el :before algo en CSS). Recomendamos evitar esta t茅cnica siempre que sea posible, en parte porque tiende a complicar situaciones como esta innecesariamente. A veces no puede evitarlo, como puede imaginar, cuando desea agregar iconos a elementos html en partes de la plantilla de su p谩gina para las que no tiene control sobre la salida.

Sin embargo, si es posible, cambie para usar <i> etiquetas, como esta:
<i class="fas fa-address-card"></i>

Si ha cargado Font Awesome 5 Solid (o 芦todos禄, incluido Solid), esto le dar谩 el estilo Solid de ese icono.

Si no puede evitar los elementos pseudo-CSS, al menos deber谩 seleccionar la familia de fuentes adecuada para esos 铆conos. Puede ver nuestra p谩gina de ayuda en Elementos de CSS simulado para obtener detalles sobre los nombres de las familias de fuentes que se utilizar谩n en esos casos, pero, por ejemplo, si estuviera usando Font Awesome 5 Free y deseara el 铆cono s贸lido, entonces se ver铆a as铆:

.li:before{
content: 'f502';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}

Esto ilustra ligeramente por qu茅 es mejor no evitar los elementos pseudo-CSS siempre que sea posible, ya que requiere una fuente familiar y una fuente codificada, que var铆a seg煤n las diferentes versiones y estilos. Maneja todas las clases de CSS elegantemente usando las clases de CSS.

Lanzador de hilos

(@sunrosea)

Hace 1 a帽o, 8 meses

Ah, ya veo, gracias por tomarse su tiempo para explicar esto. Est谩 funcionando ahora. 馃檪

(@mlwilkerson)

Hace 1 a帽o, 8 meses

隆Genial!

驴Solucion贸 tu problema??

0 / 0

Deja una respuesta 0

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