Como usar fuentes personalizadas en WordPress

WordPress viene con una variedad de fuentes que están listas para usar. Con aproximadamente el 40% de todos los sitios web creados en la plataforma, el uso de diferentes fuentes puede ayudar a que tu sitio web se destaque. 

Las fuentes personalizadas permiten establecer mejor la identidad de tu marca, aumentar la legibilidad y crear una experiencia general mejor y única para tus visitantes. 

Fuentes personalizadas

Los temas de WordPress no contienen todas las fuentes existentes. Sin embargo, existen varias fuentes gratuitas y de pago que se pueden utilizar para obtener las fuentes que necesita en WordPress, siendo las dos principales Google y Adobe.

Fuentes de Google

Tanto los principiantes como los usuarios experimentados utilizan Google Fonts, ya que son rápidas y fáciles de poner en funcionamiento.

Otros beneficios incluyen la amplia variedad de fuentes, el rendimiento (las fuentes se sirven desde los servidores de Google y la entrega rápida de contenido ayuda al SEO), se actualizan periódicamente y, quizás lo más atractivo de todo es que son de código abierto y de uso gratuito.

Agregar fuentes de Google a WordPress usando un complemento

Como ocurre con la mayoría de las cosas relacionadas con WordPress, existe un complemento para eso. En este caso, se llama Google Fonts Typography by Fonts Plugin.

Para instalar el complemento, inicia sesión en tu sitio web de WordPress a través de wp-admin. Una vez que hayas iniciado sesión en el menú principal de WordPress, deberás colocar el cursor del mouse sobre donde dice «Complementos» (plugins) en el menú de la izquierda y hacer clic en «Agregar nuevo complemento».

La pantalla Agregar nuevo complemento debería cargarse después de unos segundos. Escribe «Google Fonts Typography» en la barra de búsqueda en la parte superior derecha y deberías ver el complemento aparecer como primer resultado.

Haz clic en «Instalar ahora» y luego presiona el botón «Activar». Una vez que se activa el complemento, aparecerá un elemento «Complemento de fuentes» en el menú de la izquierda. Haz clic en «Personalizar fuentes» en la barra lateral de administración. Esto te llevará al personalizador de temas en WordPress y debería abrir la sección Complemento de fuentes.

Al hacer clic en «Configuración básica» podrás cambiar las fuentes predeterminadas de tu sitio web. La «Configuración avanzada» permite cambiar fuentes para áreas específicas. 

Configuración básica 
La configuración básica permite cambiar la fuente de tus títulos, botones y contenido escrito.

Los menús desplegables en «Familia de fuentes» brindan una lista de fuentes para elegir, con tu fuente predeterminada actual en la parte superior de la lista. Después de elegir una fuente, verás una vista previa.

Configuración avanzada
La Configuración avanzada presenta las mismas opciones que la Configuración básica, pero divididas en opciones más especificas, para que puedas ajustar tus selecciones.

Aquí hay una breve descripción de cada opción: 

Branding : cambia la fuente del título y la descripción de tu sitio. 
Navegación : configura la tipografía de los menús de navegación. 
Contenido : realiza cambios en la tipografía de tu contenido, así como en cada una de las etiquetas de encabezado.
Barra lateral : controles de fuente para los encabezados y el contenido de la barra lateral. 
Pie de página : control de fuentes para los encabezados de la barra lateral y el contenido del pie de página del sitio. 

Puedes elegir qué fuente deseas utilizar seleccionándola en el menú desplegable. Cuando estés satisfecho con tus elecciones, puedes hacer clic en «Publicar» para que los cambios se publiquen.  

Fuentes de Adobe

Agregar fuentes de Adobe a WordPress es similar a agregar fuentes de Google usando los métodos anteriores. La principal diferencia es que debes registrarte en Adobe Fonts antes de poder seleccionar una fuente de la biblioteca.

Otra diferencia significativa es que no todas las fuentes que verás en Adobe Fonts son gratuitas y de código abierto. 

Para incrustar manualmente la fuente en tu sitio web, selecciona la opción «Agregar al proyecto web»

Si aún no tienes un proyecto, puedes crear uno nuevo:

Después de hacer clic en «Crear», se proporcionará el código para copiarlo en tu sitio web.