Tipografía e iconos

Tipografías

Formatos de tipografía web

A la hora de descargar una fuente debes fijarte en el formato que tiene:

  • WOFF: Es el formato más compatible con la mayoría de los navegadores.
  • WOFF 2: Evolución del anterior con un mayor nivel de compresión.
    Si solo vas a utilizar un formato, elige este.
  • EOT: Creado por Microsoft, reconocible para versiones anteriores a IE9.
  • TTF: Útil para navegadores antiguos.

 

Font Squirrel es una de las mejores páginas de fuentes para descargar.

 

Añadir fuentes Elementor Pro

Para instalar fuentes en Elementor Pro, hay que ir a Elementor > Tipografías Personalizadas > Añadir nuevo.
Añadimos el nombre, el peso, el estilo de la fuente.
Subimos los diferentes formatos que vamos a utilizar y hacemos clic en publicar.

 

Iconos

 

Tipos de iconos en Elementor Pro

Con Elementor Pro podemos utilizar tres formatos de iconos:

  1. Iconos de fuentes de web: Elementor Pro incluye una biblioteca de iconos basadas en fuentes de web, como son Font AwesomeMaterial Icons y otras.
  2. SVG (Scalable Vector Graphics): También es compatible con el formato SVG, que es un formato de gráficos vectorial escalable, que se pueden ampliar y reducir sin perder calidad.
  3. Iconos de fuentes personalizadas: Puedes cargar tus propias fuentes personalizadas y utilizar los caracteres de esas fuentes como iconos.Los iconos de fuentes personalizadas son conjuntos de iconos que se crean utilizando fuentes tipográficas personalizadas en lugar de fuentes estándar.

 

Dónde descargar iconos de fuentes personalizadas

  • icoMoon: Es una herramienta popular para crear fuentes de iconos personalizadas. Puedes seleccionar iconos de su biblioteca y luego descargarlos en formato ZIP para subirlos a Elementor Pro.
  • Fontello: Otro generador de fuentes de iconos que permite seleccionar iconos de diferentes conjuntos, para más tarde descargarlos en un ZIP.
  • Fontastic: Con esta última herramienta puedes crear, de una forma rápida y fácil, tus fuentes de iconos en segundos. Tiene más de 9.000 iconos disponibles.

 

Añadir iconos personalizados

En WordPress nos dirigimos a Elementor iconos personalizados > añadir nuevo.

Podemos agregar nuestro archivo ZIP con las fuentes arrastrándolo a esta pantalla o haciendo clic en el botón para navegar hasta él.

Sólo nos queda probar los iconos personalizados que hemos añadido.
Para ello, nos vamos a editor de Elementor, añadimos el widget de icono y hacemos clic en Biblioteca de iconos, donde podemos ver los iconos que disponemos y entre ellos,  un apartado nuevo, llamado Mis Bibliotecas, donde estarán los nuevos iconos personalizados.