¿Cómo añadir el código de seguimiento de Google Analytics en GeneratePress?

En este tutorial, te mostraré cómo añadir el código de Google Analytics a la versión gratuita y premium del tema GeneratePress.

No necesitas ningún plugin para añadir el código de seguimiento a GeneratePress Premium. Pero necesitarás uno para la versión gratis, te explicaré también cómo en este artículo.

GeneratePress es un tema gratuito y ligero que puede ser ampliado mediante la instalación de un plugin Premium que permite añadir muchas características y funciones. Es un tema receptivo personalizable y bien codificado construido con un enfoque en la velocidad y la usabilidad.

Este blog está desarrollado con GeneratePress.

Mientras se crea una página web tienes que ocuparte de varias cosas y añadir el código de Google Analytics es una de ellas.

Google Analytics ayuda a rastrear el tráfico de tu sitio web, es la mejor herramienta disponible y gratuita en el mercado para seguir los visitantes en un sitio web.

Puedes aprender más sobre Google Analytics acá y si necesitas un tutorial para crear una cuenta puedes dar un ojo a este artículo.

¿Qué es el código de Google Analytics y cómo obtenerlo?

El código de seguimiento de Google Analytics es un fragmento de JavaScript, implementado en tu HTML, que recoge y envía datos a Analytics desde un sitio web.

Al instalar Google Analytics en tu sitio, puedes rastrear todos los datos de cada página de tu sitio web, por ejemplo, las visitas a las páginas, la experiencia del usuario, los porcentajes de rebote, las dimensiones, las métricas, etc.

Desde el mes de octubre 2020, para obtener tu código JavaScript tienes 2 maneras porque Google lanzó una nueva versión de su herramienta que se llama Google Analytics 4. Si necesitas actualizar a la última versión, puedes leer cómo actualizar a Google Analytic 4.

Para ambas versiones inicia sesión en tu cuenta, luego para la antigua versión ve a Administrar (el engranaje abajo de todo) y en la columna Propiedad haz clic en Información de seguimiento > Código de seguimiento.

codigo javascript de seguimiento google analytics

Cópia este código.

Para Google Analytics 4, la nueva versión, ve a Administrar (el engranaje abajo de todo) y en la columna Propiedad haz clic en Flujos de datos y luego en tu sitio web.

Aparecerá una nueva ventana, haz clic en Añadir etiqueta en la página (1) > Etiqueta global de sitio web (gtag.js) (2). Ahora puedes ver que el código es un poco diferente al otro, pero se usa exactamente de la misma manera, es decir copiendolo en la sección <head> de tu sitio web.

codigo de medicion google analytics 4

Cópia este código pinchando en el símbolo arriba a la derecha, ahora lo instalaremos en tu tema GeneratePress.

Añadir Google Analytics en GeneratePress Premium sin plugin

Sobre todo, no necesitas instalar ningún plugin para añadir el código de seguimiento. Se recomienda usar la menor cantidad de plugin posible para que tu página web se cargue más rápido.

Veamos cómo podemos añadir fácilmente el código de GA en el tema GeneratePress.

1 – Crea un elemento Hook

El primer paso es crear un nuevo elemento Hook (gancho).

Ingresa a tu área de administración de WordPress y haz clic en Apariencia > Elementos en la barra izquierda y luego haz clic en Añadir un nuevo Elemento arriba y elige el tipo de Elemento Hook en la lista desplegable.

¡Ojo! si no te aparece en el menú, primero tienes que ir en Apariencia > GeneratePress para activar los Elementos.

crear un nuevo elemento hook en generatepress

En la pantalla que sigue, puedes editar tu nuevo elemento Hook.

2 – Añade tu código de seguimiento de Google Analytics

A continuación, agrega un título a este gancho como «Google Analytics» (esto no se mostrará en las entradas del blog).

añadir el codigo de seguimiento de google analytics en generatepress

Y en el campo de edición, copia y pega el código de tracking de Google Analytics que has copiado anteriormente. O el nuevo código de medición de Google Analytics 4.

3 – Configura los ajustes del Hook

El siguiente paso es configurar el elemento Hook de tal manera que el código de seguimiento de Google Analytics se añadirá a la cabecera HMTL de todas las páginas de tu sitio web.

En Ajustes, selecciona wp_head en la lista desplegable situada junto a Hook. Esto agrega el código de seguimiento al elemento <head> de tu HTML.

implementar el codigo de seguimiento en la cabecera de generatepress

En la pestaña Reglas para Mostrar, junto a Posición, selecciona Todo el sitio en la lista desplegable. Esto, como has adivinado, añadirá el código a todas las páginas de tu sitio web GeneratePress.

configurar el elemento hook de generatepress

4 – Publica el Elemento Hook

Una vez que tu Elemento Hook sea creado y configurado de la manera correcta, puedes pulsar el botón de publicación.

publicar el elemento hook

Si estás usando un plugin de caché, no olvides limpiar el caché.

Y como puedes ver en tu lista de Elementos, aparece tu nuevo Hook que has creado.

lista de los elementos hook de generatepress

Añadir Google Analytics en GeneratePress con un plugin

Si estás usando la versión gratuita de GeneratePress, entonces no hay una opción directa para colocar el código de seguimiento de Google Analytics. Y si lo añades en la carpeta header.php, se borrará automáticamente en el momento de la actualización del tema.

Para solucionar este problema, puedes utilizar el plugin Insert Headers and Footers.

Ingresa en tu herramienta de WordPress y haz clic en Plugins y después en Añadir nuevo. En la barra de búsqueda escribe «header and footer», una vez que hayas encontrado el plugin, instálalo y actívalo.

plugin wordpress para añadir codigo en la cabecera del tema

Luego, en el menú Ajustar en la barra lateral, haz clic en la nueva pestaña Insert Headers and Footers y pega el código JavaScript de GA, o el nuevo de Google Analytics 4 que vimos antes, en el Scripts in Header como en la imagen a continuación.

integrar el codigo de seguimiento en un plugin

Todo lo que tienes que hacer es Guardar con el botón abajo para activar la conexión entre tu sitio de WordPress y Google Analytics.

Eso es todo, has instalado con éxito Google Analytics en tu sitio.

¿Cómo comprobar que el código de GA funciona correctamente?

Para comprobar que tu código está correctamente configurado, puedes ver la actividad de los usuarios en tiempo real en tu sitio.

Para hacerlo, ve al menú En tiempo real > Visión general ubicado en la columna izquierda en tu cuenta de Google Analytics y abre una página en tu sitio web (tu página de inicio, por ejemplo).

Si Google Analytics está bien conectado a tu sitio, deberías ver el número 1 En este momento. Si este es el caso, significa que los datos de tu sitio están saliendo bien en Google Analytics.

comprobar el codigo de seguimiento de google analytics

La conexión entre tu página web y Google Analytics puede tardar de unas pocas horas a 24 horas. No te preocupes si no aparece de inmediato.

Para Google Analytics 4 todo sigue igual, solamente que el diseño de la página es un poco diferente.

Conclusión

Sin duda, el código de seguimiento de Google Analytics es un factor importante para vigilar las actividades de los usuarios en tu página web. Aprende a manejar las estadísticas básicas y poco a poco conocer más sobre esta herramienta super buena e interesante para el SEO.

Es la herramienta esencial para todos los sitios web, así que ¡úsalo ahora! Aunque si no te sea útil en este momento, sin duda lo será en el futuro.

Espero que hayas encontrado útil este artículo y si te gustó no dudes en compartirlo en las redes sociales. Y si tienes alguna pregunta, pregúntame en los comentarios.

Deja un comentario