Medios de tulipán

Pensamientos emprendedores

Cómo agregar una fuente personalizada a un tema de WordPress con @fontface CSS3

Declarar una fuente personalizada en tu tema de WordPress es muy útil para personalizarlo y adaptarlo a tu carta gráfica. Sin embargo, a veces la fuente de tus sueños no se encuentra en las opciones de tu tema, ni en Google Fonts o TypeKit.

En este caso, tendrás que modificar un poco tu tema para agregar la fuente que deseas. Pero que no cunda el pánico, ¡te explicaré cómo hacerlo!

Descarga la fuente

Primero, necesitas tener la fuente, ya sea descargándola de sitios de fuentes como dafont por ejemplo, o por sus propios medios.

Cuidado con los derechos de autor, que debes respetar. No dudes en comprar la fuente cuando sea necesario. ¡Solo pagarás a quienes trabajaron en él para que puedas disfrutarlo!

Los formatos TTF y OTF se utilizan ampliamente en la actualidad y son compatibles con la mayoría de los navegadores. Sin embargo, si necesita convertir la fuente a otros formatos, vaya a Fuente Ardilla.

 

Sube la fuente a tu servidor

Sube tu fuente a una carpeta de "fuentes" en tu tema (preferiblemente tema secundario), a través de FTP.

 

Declara tu nueva fuente en tu CSS

Vaya al archivo CSS del tema secundario si cargó la fuente en la carpeta "fuentes" del tema secundario; de lo contrario, al archivo CSS del tema principal, o en la configuración de su tema si le permite personalizar CSS a través de el backoffice de WordPress. He aquí cómo hacerlo:

@font-face { font-family: myfont; src: url("fuentes/mapolice.otf"); src: url(fonts/mapolice.ttf) formato('truetype'); peso de fuente: normal; }

Utilice la nueva fuente a través de CSS

Para usar su nueva fuente recién declarada, nada podría ser más simple, solo necesita indicarle al archivo CSS a qué formatos desea asignar la fuente:

 

p,span {familia de fuentes: mapolice, Open Sans, Arial, sans-serif !importante;} h1,h2,h3,h4,h5,h6 {familia de fuentes: mapolice, Open Sans, Arial, sans-serif !importante ;} ;} div {familia de fuentes: mapolice, Open Sans, Arial, sans-serif !important;}

Y ahí lo tienes, si este artículo te ha ayudado no dudes en compartirlo en las redes sociales 😉

 

Mis últimos tuits

Nuevos cortos sobre Blooness 👉 Relanzamiento de la libido, a granel -> Sol, vitamina D, dieta cetomediterránea, proteínas, libros, bromas, caminatas, HIIT y dieta sin hipocalorías.
https://buff.ly/445PWvc

Nuevos shorts en Blooness 👉 Mejora tu sueño -> exponerte a la luz por la mañana, limitar las gafas de sol, mojarte la camiseta durante el deporte, beber descafeinado, comer máximo 3 horas antes de dormir, hacer un paseo digestivo y tomar melatón
https://buff.ly/440weAJ

Carga más

No te pierdas el asesoramiento empresarial por correo electrónico

Sin spam, solo un correo electrónico cuando se publica nuevo contenido..

Deja una respuesta

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

es_ESES