El API de fuentes web de fuentes de Google le permite cargar fácilmente fuentes personalizadas (a diferencia de las fuentes de escritorio estándar como Arial, Georgia, Times New Roman o Helvetica) simplemente haciendo referencia a una hoja de estilo en la etiqueta de encabezado de su sitio. Si está desarrollando temas de WordPress y desea personalizar las fuentes de su sitio sin el uso de un complemento, puede poner fácilmente en cola las fuentes personalizadas de Google en su sitio para usarlas en su CSS.
Paso 1: seleccione su fuente personalizada de Google
Usar la fuente de Google es muy fácil. Si te diriges a la página principal en “Fuentes web de Google” y haga clic en cualquier fuente, aparecerá una pequeña ventana emergente para que pueda personalizar la fuente y ver la URL correcta para la fuente CSS.
Si está creando un sitio HTML simple o está editando su tema personal personalizado de WordPress, todo lo que necesita hacer para cargar la fuente personalizada en su sitio web es copiar y pegar el enlace de la hoja de estilo a la fuente personalizada que está alojada en Google en su
Dicho esto, la forma preferida de agregar la fuente de Google a su tema de WordPress (muy importante al crear temas para distribución) es hacer uso de WordPress wp_enqueue_scripts gancho de acción
Paso 2: Ponga en cola su fuente de Google
Como se mencionó anteriormente, puede colocar fácilmente el código de Google en su archivo header.php; sin embargo, es mejor poner en cola el script a través del enlace de acción como se indicó anteriormente. Esto permite modificaciones de temas secundarios más fáciles y también evita conflictos con complementos de terceros.
Paso 1: Para comenzar, pegue el siguiente código en su archivo functions.php (si este archivo no existe, cree uno nuevo en la carpeta de su tema y asegúrese de que el código a continuación esté pegado dentro de las etiquetas php.
function myprefix_enqueue_google_fonts() {
wp_enqueue_style( 'roboto', 'https://fonts.googleapis.com/css?family=Roboto' );
}
add_action( 'wp_enqueue_scripts', 'myprefix_enqueue_google_fonts' );
En este fragmento en particular usamos el wp_enqueue_style función para cargar la fuente de Google «Roboto» en el sitio web. Sin embargo, puede usar esta función varias veces para cargar varias fuentes.
Paso 2: Ahora solo tiene que abrir su archivo style.css y cambiar el nombre de la fuente para los elementos para los que desea la fuente personalizada o agregar CSS personalizado a su sitio para modificar la fuente, como el siguiente ejemplo para cambiar la fuente de todo el cuerpo a Roboto .
body { font-family: "Roboto"; }
Extra: usar un complemento de WordPress de Google Fonts
Por supuesto, si no está desarrollando un tema para la distribución o no está utilizando un tema secundario para su proyecto, entonces puede ser mejor usar un complemento personalizado para agregar fuentes a su sitio. En el artículo titulado «Mejore la tipografía de su sitio web de WordPress con Google Fonts», recomendamos algunos complementos increíbles que le permitirán modificar fácilmente las fuentes en su sitio de WordPress y, más específicamente, usar Google Fonts.
Tus pensamientos… ¿Cómo usas Google Fonts?
¡A usted ahora! Háganos saber en los comentarios cómo está utilizando las fuentes de Google en WordPress. ¿Está desarrollando temas o complementos, creando sitios web personalizados o es un profesional independiente que ayuda a las personas a modificar los diseños de sus sitios actuales? También háganos saber cuáles son algunas de sus fuentes de Google favoritas. Mis favoritos personales son Roboto, Lora y PT Serif.