Cómo quitar las Google Fonts de Divi, Genesis y más temas

Como seguramente sabrás, hay muchos, muchísimos temas que cargan Google Fonts, a veces en exceso, pero hay que entenderlo, y es que para un desarrollador de temas es comodísimo cargar fuentes desde Google para hacer su tema más atractivo visualmente, sin tener que alojarlas en el tema, reduciendo su peso. Ahora bien, esto tiene un problema, o varios.

Google Fonts y el WPO

Si has analizado tu web en cualquier servicio de medición de optimización y velocidad habrás visto que detectan la carga de recursos externos desde Google Fonts como un problema. Esto es debido a que son llamadas externas que tu web hace para finalmente mostrar su contenido, desde recursos que no siempre tienen porque estar disponibles, y sí, es un problema. Uno pensaría que ¡coño, si son de Google, cargarán rápido! Pero ¿y si Google borra mañana esa fuente por un problema de derechos, rentabilidad, o lo que sea? Y es solo un ejemplo. También puede pasar que los servidores donde se alojan las Google Fonts tengan retardos de carga por cualquier motivo, lo que afectaría a la carga de tu web, pues habría recursos que no terminarían nunca de mostrarse/cargarse. Así que lo mejor es alojar las fuentes localmente, o no cargarlas desde Google Fonts.

Google Fonts y la privacidad

Por si no lo sabías, resulta que si tu tema usa Google Fonts estás compartiendo las IPs de tus visitantes con Google. Vamos, que Google no pierde oportunidad de obtener información sobre nuestros usos de Internet en cualquier ocasión. Y claro, si estás comprometido con la privacidad, no digamos desde la aparición del RGPD, deberías o informar a tus usuarios en tus políticas de privacidad de que eso está pasando, o simplemente evitar la carga de Google Fonts en tu web, y que se muestre con las fuentes del sistema del usuario.

¿Cómo desactivo la carga de Google Fonts?

Si lo tienes claro, vamos a ver cómo impedir la carga de Google Fonts, y en consecuencia la recuperación de datos privados de tus visitantes (IPs) con Google. Lo que haremos, tanto para Divi como para cualquier otro tema, es utilizar la función de WordPress wp_dequeue_style, con la que evitaremos la carga de Google Fonts de la hoja de estilos CSS del tema. Para ello necesitamos saber el nombre a incluir en el $handle de la función, y aquí tienes una lista de los temas más utilizados:

TemaNombre de hoja de estilos con Google Fonts ($handle)
Twenty Twelvetwentytwelve-fonts
Twenty Thirteentwentythirteen-fonts
Twenty Fourteentwentyfourteen-fonts
Twenty Fifteentwentyfifteen-fonts
Twenty Sixteentwentysixteen-fonts
Twenty Seventeentwentyseventeen-fonts
Genesis Samplegenesis-sample-fonts
Extraextra-fonts
Dividivi-fonts

Una vez sabemos la función a utilizar y el $handle solo tenemos que añadir nuestro código al archivo functions.php del tema activo, así:

// Quitar Google Fonts del tema Divi
add_action( 'wp_print_styles', 'ft_dequeue_divi_fonts_style' );
function ft_dequeue_divi_fonts_style() {
      wp_dequeue_style( 'divi-fonts' );
}

En el ejemplo anterior estamos evitando la carga de Google Fonts en Divi. Para que veas otro ejemplo, en Genesis sería así:

// Quitar Google Fonts del tema Genesis Sample
add_action( 'wp_print_styles', 'ft_dequeue_genesis_fonts_style' );
function ft_dequeue_genesis_fonts_style() {
      wp_dequeue_style( 'genesis-sample-fonts' );
}

Fácil ¿eh?

¿Prefieres usar un plugin?

Si no te animas con el código también puedes usar un plugin como Disable Google Fonts, pero solo si tu tema es alguno de estos: Twenty Twelve, Twenty Thirteen, Twenty Fourteen, Twenty Fifteen, Twenty Sixteen, Twenty Seventeen.

¿Cómo alojo localmente las Google Fonts?

Otra posibilidad, por supuesto, sería almacenar localmente las Google Fonts que use tu tema. De este modo mantienes totalmente la estética de tu tema al mismo tiempo que respetas la privacidad de tus visitantes de cara a Google. En este caso el proceso pasa por descargar las fuentes de Google, alojarlas en tu servidor y cambiar las llamadas internas de la hoja de estilos, para que apunten a la nueva dirección donde están las fuentes, como ya vimos. Es algo más complicado pero una buena solución en cualquier caso.

VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(10 votos, promedio: 4.9)

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

11 comentarios en “Cómo quitar las Google Fonts de Divi, Genesis y más temas”

  1. Bruno Armenteros

    Gracias por la info! Una cosilla en los dos ejemplos hay una comilla justo antes de divi-fonts y genesis-sample-fonts que creo que no está bien. Al menos a mi cuando he copiado el codigo y pegado fallaba a la hora de cargar.
    Un saludo

  2. Buenas Fernando, ¿sabes si ha cambiado algo en este tema? Parece surrealista que dependa de los usuarios y no de que Google lo controle desde su CDN (al igual que es posible anonimizar las IPs de Analytics). Pregunto porque veo que en tu web sigues cargándolas con CDN y quizás algo han actualizado por cumplir la querida ley.

    No sé si has visto la solución de forbes que parece el típico aviso que se muestra cuando una web ha sido hackeada.

    Muchas gracias por tu respuesta.

    1. La solución de Forbes y otros como LA Times es no ofrecer contenido a los usuarios de la UE, que ni es solución ni es nada jaja.

      Yo aún no he quitado las Google Fonts, las cargo desde CDN cacheadas con un JS de Autoptimize

  3. Gracias… Disculpa mi ignorancia… En el personalizador de Divi – Ajustes generales – Tipografía – Fuente del cuerpo de del texto, he seleccionado Muli… y en algunas secciones como los títulos, en la pestaña diseño del título selecciono una de las que me ofrece…

    Tenía entendido que Divi carga estas fuentes en mi Sitio… pero por lo visto lo tenía mal entendido… pues en caso contrario, este artículo no tiene sentido… ¿Me equivoco?

    Entonces, si quito las Google Fonts como se explica… ¿qué opción me queda para aplicar alguna fuente? ¿Descargarla de Google y alojarla en mi servidor como se indica al final del artículo?

    Gracias de nuevo…

  4. Buenas; en las opciones del tema Divi he visto «Use Google Fonts».. con desactivar esa opción sería suficiente?

      1. Hola, Yo lo acabo de probar y con el código que has puesto para Divi copiado tal cual he notado que las seguía cargando y al desactivar la opción he visto que ya no las carga.
        ¿Has probado el código en las últimas versiones?
        En combinación con el post de almacenar localmente va genial de momento tengo que darle un tiempo.

Deja un comentario

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

 

Ir arriba Ir al contenido