Cómo agregar una fuente sin conexión a su sitio de WordPress

Si está buscando agregar un poco de personalidad adicional a su sitio de WordPress, entonces puede considerar cargar una fuente sin conexión. Si bien hay muchas maneras de hacer esto, le mostraremos uno de los métodos más fáciles usando el generador de fuentes web Font Squirrel. Una vez que haya descargado sus archivos de fuentes , puede cargarlos en su sitio de WordPress y usarlos como cualquier otra fuente. ¡Empecemos!

Este artículo había estado sentado en mi escritorio durante bastante tiempo y quería compartirlo con ustedes. Las fuentes de Google están completamente cargadas localmente. He estado usando las fuentes de Google Oswald y Lato de Crunchify.com hasta ahora. Simplemente abra la URL en la imagen de arriba que aparece en la nueva pestaña y notará que ha generado 14 fuentes nuevas . Este tutorial también le ayudará si tiene alguna de las siguientes preguntas. Una vez que haya extraído el archivo Lato.zip, podrá ver las diez fuentes de Lato con la extensión .ttf. En la mayoría de los sitios web, solo necesita fuentes regulares, en negrita y en cursiva.

En el Paso 2, ahora debe convertir sus fuentes a los formatos woff2, eot,svg, ttf y wof. Se puede cargar un archivo en el sitio https://Font-Converter.net/en que convertirá la fuente a estos formatos. Nada mas necesita ser dicho. Ahora puede cargar fuentes desde su sistema de archivos local.

¿Cómo agrego fuentes personalizadas al tema de WordPress?

Hay algunas formas diferentes de agregar fuentes personalizadas a su tema de WordPress. Una forma es usar la biblioteca de Google Fonts. Puede encontrar una lista completa de todas las fuentes disponibles en el sitio web de Google Fonts. Una vez que haya encontrado una fuente que le guste, puede agregar el código a la hoja de estilo de su tema (style.css). Por ejemplo, si quisiera usar la fuente "Open Sans", agregaría el siguiente código a su hoja de estilo: body { font-family: 'Open Sans', sans-serif; } Otra forma de agregar fuentes personalizadas a su tema de WordPress es usar un complemento como Easy Google Fonts . Este complemento facilita agregar fuentes personalizadas a su tema sin tener que editar ningún código.

El complemento Easy Google Fonts se puede usar para agregar fuentes personalizadas a su sitio de WordPress. Al utilizar este método, podrá llamar la atención sobre su sitio web mediante el uso de una amplia gama de fuentes. Se ha demostrado que la tipografía tiene una serie de beneficios en la investigación. Un sitio web simple facilita que los clientes se comuniquen con usted. Al usar las propiedades de CSS, puede cambiar el estilo y la posición de su fuente preferida además de cambiar su estilo y posición. Además de sus propios controles de fuente, puede usar la página de configuración del complemento de WordPress para agregarlos. Si no desea usar un complemento, puede usar este en lugar de las fuentes de Adobe.

Instale el complemento Custom Adobe Fonts para simplificar la incorporación de estas fuentes en su sitio de WordPress. Instale el complemento, luego navegue a la amplia biblioteca de fuentes de Adobe para encontrar una fuente que funcione para usted (debe registrarse para usarla). Después de elegir una fuente, haga clic en ella y luego busque en la esquina superior derecha de la página "Agregar al proyecto web". Usando Font Pair, puede ver cómo se ven sus combinaciones de fuentes, y puede mezclar y combinar fuentes según lo que ve. Hay varios sitios web excelentes que venden fuentes personalizadas que fueron creadas por los propios diseñadores. Se incluye una gran biblioteca de fuentes con la fuente Squirrel, y también es fácil de implementar. Puede utilizar el kit de fuentes web de @Font-Face.

Su sitio web de WordPress ahora debería estar listo para usar. El kit incluye el archivo de fuentes, así como una hoja de estilo que contiene el código que necesitará para crear su propia hoja de estilo CSS. Por ejemplo, necesitaríamos usar el siguiente CSS para la fuente OpenSans-ExtraBold- web . La mejor solución es guardar todos los archivos de fuentes en la ubicación que elija.

Cómo cargar fuentes de Google en WordPress

Navegue hasta el panel de administración de WordPress y seleccione Agregar nuevo. Descargue e instale Easy Google Fonts desde Google Play Store. Después de instalar el complemento, debe hacer clic en el botón Activar para comenzar a usarlo.

En su sitio web o productos digitales, puede usar Google Fonts para experimentar con más de 1000 familias de fuentes diferentes. Si desea agregar fuentes de Google manualmente a su sitio de WordPress, hay varias opciones. Son gratuitos y de código abierto, por lo que cualquier desarrollador puede utilizarlos. La forma más conveniente de integrar las fuentes de Google es incluir un fragmento con la URL de la familia de fuentes específica en su archivo functions.php. Si encuentra difícil el proceso manual, puede usar un complemento. Primero puede instalar el complemento visitando el repositorio de complementos de WordPress. Ahora debe estar instalado y activado.

La mayoría de los temas de WordPress incluyen la integración de fuentes de Google como parte de su configuración predeterminada. Los complementos que componen la plataforma OMGF le permiten explorar más de 600 fuentes en su sitio web. En el menú desplegable 'Familia de fuentes', puede seleccionar entre más de 100 tipos diferentes para varias secciones de su sitio. Hay varias opciones para agregar controles de fuente personalizados , como se muestra en la vista previa del personalizador.

¿Debo cargar Google Fonts localmente WordPress?

Si su sitio de WordPress tiene errores de fuentes de Google, debe cargar las fuentes de Google localmente para resolverlos. Hay algunos recursos y scripts externos que no puede controlar, lo que hace que sea imposible comprimirlos, minimizarlos u optimizarlos. Su velocidad de WordPress se verá gravemente afectada si no toma estas precauciones.

Wp-content/themes/tu-tema/fuentes

La carpeta wp-content/themes/your-theme/fonts es donde puede almacenar cualquier fuente personalizada que desee usar con su tema. Las fuentes se pueden agregar a esta carpeta a través de FTP o mediante un complemento de administrador de archivos. Una vez que las fuentes se agregan a esta carpeta, se pueden usar en el CSS de su tema haciendo referencia al nombre de la fuente.

Los estilos globales se pueden usar para cambiar la fuente de su sitio web si usa uno de los siguientes temas. En este caso, las fuentes de la base y los encabezados están en el mismo par de fuentes. Para guardar los nuevos emparejamientos de fuentes, haga clic en el botón Publicar en el menú Estilos globales o haga clic en Restablecer para revertir los cambios. Una vez que haya elegido las fuentes personalizadas adecuadas, puede cambiarlas con la frecuencia que desee. Si desea cambiar el tamaño de su encabezado o de las fuentes base, puede hacerlo seleccionando la opción de tamaño a continuación y a la derecha de cada fuente, y luego seleccionando un tamaño en el menú desplegable. Con CSS personalizado, puede cambiar el tamaño de fuente predeterminado global. Asegúrese de desactivar o eliminar un complemento si decide dejar de usarlo después de probarlo. No es posible vincular una cuenta de Typekit.com a un blog o sitio web de WordPress.com. Si desea probar la compatibilidad de una fuente específica con un idioma determinado, use el Personalizador.

Agregar fuentes a WordPress sin complemento

Hay algunas formas de agregar fuentes a WordPress sin un complemento. Una forma es usar la biblioteca de Google Fonts. Simplemente vaya al sitio web de Google Fonts, seleccione la fuente que desea usar y luego copie el código proporcionado. A continuación, abre tu panel de WordPress y ve a Apariencia > Personalizar. Luego, haga clic en la pestaña "CSS adicional" y pegue el código que copió de Google Fonts. Guarde sus cambios y la nueva fuente se aplicará a su sitio web.

Los temas no tienen que incluir fuentes web en su configuración predeterminada. Mientras navega por una página web, podrá descargarla usando su navegador. Para copiar y pegar el código de fuentes en su archivo de tema, simplemente elija la fuente que desee. Puede usar varias fuentes al mismo tiempo y verá cuánto tiempo se cargan las fuentes. Agregue más CSS a su blog de WordPress yendo al panel de control del blog de WordPress. Copie todo el código del cuadro gris 1 en la fuente web del cuerpo del texto. La nueva familia de fuentes web se puede encontrar en el segundo cuadro gris de la biblioteca de fuentes de Google . Además, el siguiente código se puede usar para ajustar el tamaño y el peso de la fuente.