Saltar al contenido principal
Zenovaydocs
8 min de lectura

Integración con Ghost

Añada Zenovay a cualquier publicación de Ghost (Ghost(Pro), Ghost CMS autoalojado o Ghost Cloud) en dos minutos. El Code Injection de Ghost está completamente disponible en todos los planes, por lo que esta integración funciona tanto para creadores en el nivel gratuito como para publicadores autoalojados.

Code Injection está disponible en todos los planes de Ghost, incluido Ghost CMS autoalojado. No se requiere actualización.

Inicio rápido

PasoDóndeQué hacer
1Panel de ZenovayCopie su fragmento de seguimiento
2Admin de Ghost → Settings → Code injection → Site HeaderPéguelo
3GuardarHaga clic en Save
4Panel de ZenovayLos visitantes en tiempo real aparecen en ~30 segundos

Método 1: Inyección en el Site Header (Recomendado)

El panel Code Injection de Ghost escribe HTML sin procesar en el <head> de cada página renderizada por su tema. Esto incluye la página de inicio, entradas, páginas, etiquetas, autores y el flujo de membresía.

Paso a paso

  1. Inicie sesión en su panel de administración de Ghost (normalmente https://su-sitio.com/ghost/).
  2. En la barra lateral izquierda, haga clic en Settings (icono de engranaje).
  3. Desplácese hacia abajo hasta Site → Code injection.
  4. En el campo Site Header, pegue:
<script defer data-tracking-code="YOUR_TRACKING_CODE" src="https://api.zenovay.com/z.js"></script>
  1. Haga clic en Save.

Verificar

Abra su sitio Ghost en incógnito y vea el código fuente — debería ver <script defer data-tracking-code=...> entre <head> y </head>. Su visita debería aparecer en la vista en tiempo real de Zenovay en ~30 segundos.

Método 2: Inyección por entrada / por página

Para rastrear solo una entrada o página específica (p. ej., un anuncio de boletín de pago), abra la entrada en el editor y use el Code Injection a nivel de entrada:

  1. Abra una entrada o página en el editor.
  2. Haga clic en el icono de engranaje (configuración) en la parte superior derecha.
  3. Desplácese hacia abajo y expanda Code injection.
  4. Pegue el fragmento en Post Header.
  5. Update la entrada.

El Code Injection por entrada se añade después del Code Injection de todo el sitio. No pegue el rastreador en ambos — contará doble.

Seguimiento de eventos personalizados

Una vez que el rastreador se carga puede llamar a window.zenovay() desde cualquier plantilla de tema de Ghost, bloque de Code Injection o incrustación HTML en Markdown de una entrada.

Rastrear suscripciones al boletín

Los formularios de suscripción de Ghost emiten un evento personalizado members:signup al completarse con éxito. Añada esto en Site Header → Code injection (después de la línea del rastreador):

<script>
  document.addEventListener('DOMContentLoaded', () => {
    document.addEventListener('submit', (e) => {
      const form = e.target;
      if (form?.matches('[data-members-form]')) {
        if (window.zenovay) {
          window.zenovay('track', 'signup', {
            form_type: form.dataset.membersForm || 'signup',
            page: window.location.pathname,
          });
        }
      }
    }, true);
  });
</script>

Rastrear clics en suscripciones de pago (Subscribe / Upgrade)

Ghost renderiza los botones de suscripción / activadores del portal con atributos data-portal. Escuche los clics:

<script>
  document.addEventListener('DOMContentLoaded', () => {
    document.addEventListener('click', (e) => {
      const target = e.target.closest('[data-portal]');
      if (target && window.zenovay) {
        window.zenovay('track', 'portal_opened', {
          action: target.dataset.portal,
          page: window.location.pathname,
        });
      }
    }, true);
  });
</script>

Identificar miembros

Ghost expone el miembro actual a través de /members/api/member/. Identifique en cada página:

<script>
  fetch('/members/api/member/', { credentials: 'include' })
    .then(r => r.ok ? r.json() : null)
    .then(member => {
      if (member && window.zenovay) {
        window.zenovay('identify', {
          userId: member.uuid,
          email: member.email,
          name: member.name,
          plan: member.subscriptions?.[0]?.plan?.nickname,
        });
      }
    })
    .catch(() => {});
</script>

Seguimiento de conversiones de pago

Para la atribución de ingresos en membresías de pago, use la integración de webhook de Stripe de Ghost y envíe los eventos de Stripe a Zenovay a través de nuestra API de seguimiento del lado del servidor. El seguimiento del lado del cliente pierde los eventos de suscripción que se completan después de que el usuario ha cerrado la pestaña (Ghost envía el recibo de forma asíncrona).

Ejemplo rápido del lado del servidor (Node.js en su propio receptor de webhooks):

// Forward Stripe checkout.session.completed → Zenovay
app.post('/webhooks/stripe', async (req, res) => {
  const event = req.body;
  if (event.type === 'checkout.session.completed') {
    const session = event.data.object;
    await fetch('https://api.zenovay.com/v1/track', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'Authorization': `Bearer ${process.env.ZENOVAY_API_KEY}`,
      },
      body: JSON.stringify({
        event: 'purchase',
        userId: session.customer_email,
        properties: {
          transaction_id: session.id,
          revenue: session.amount_total / 100,
          currency: session.currency,
        },
      }),
    });
  }
  res.json({ received: true });
});

Trabajo con temas de Ghost personalizados

Si mantiene un tema de Ghost personalizado (p. ej., bifurcado de Casper, Source o Edition), el Code Injection se renderiza a través del helper {{ghost_head}}. Siempre que su default.hbs incluya:

{{!-- in default.hbs --}}
{{ghost_head}}

…Zenovay se carga correctamente. La mayoría de los temas de Ghost de terceros incluyen esto por defecto. Si el suyo no lo tiene, añádalo dentro de <head> antes de </head>.

Requisitos del plan

Edición de GhostCode InjectionTemas personalizadosSeguimiento del lado del servidor
Ghost(Pro) Starter✅❌ (solo Casper)✅ vía webhooks
Ghost(Pro) Creator✅✅✅
Ghost(Pro) Team / Business✅✅✅
Ghost CMS autoalojado✅✅✅

Problemas comunes

{{ghost_head}} faltante en temas personalizados. Este es el problema n.º 1 en sitios con temas personalizados. Si el rastreador no aparece en el código fuente de la página, verifique que su default.hbs incluya el helper. Sin él, el Code Injection no tiene dónde renderizarse.

Entradas AMP. Si ha habilitado AMP a través de la integración Ghost AMP, el Code Injection no se aplica a las URLs /su-entrada/amp/ (AMP elimina los scripts arbitrarios). Desactive AMP o acepte que el tráfico AMP no se rastrea. A partir de Ghost 5.x, AMP está siendo desenfatizado; recomendamos desactivarlo.

Correos electrónicos del boletín. El Code Injection solo se aplica a su sitio web, no a los correos electrónicos del boletín salientes. Las aperturas de correo las rastrea el propio Ghost; puede sincronizar esos datos a través de la Ghost Admin API en Zenovay si lo desea, pero está fuera del alcance de la integración básica.

Entradas solo para miembros. El rastreador se ejecuta en cada renderizado de página, incluidas las vistas previas con acceso restringido. Si solo desea rastrear las vistas de entrada después de que se desbloquee el muro de pago, condicione su evento personalizado a la respuesta de /members/api/member/ mencionada anteriormente.

Ghost autoalojado en Docker / Kubernetes. No se necesita configuración adicional — el Code Injection vive en la base de datos de Ghost, no en el sistema de archivos. Simplemente pegue el fragmento a través de la UI de administración como de costumbre.

Resolución de problemas

SíntomaCausa probableSolución
Sin datosRastreador no está en el código fuente de la páginaVerifique que {{ghost_head}} esté presente en default.hbs
Sin datos en algunas entradasCode Injection por entrada anulandoMueva el fragmento al Header de todo el sitio
Vistas de página duplicadasFragmento en Site Header y en Code Injection por entradaElija un solo ámbito
Sin datos en URLs /amp/AMP elimina los scriptsDesactive AMP o acepte la brecha
Los miembros nunca se identifican/members/api/member/ devuelve 404Está usando una versión antigua de Ghost (< 4.x) — actualice

Privacidad y cumplimiento normativo

Para el seguimiento sin cookies, añada data-cookieless="true":

<script defer
        data-tracking-code="YOUR_TRACKING_CODE"
        data-cookieless="true"
        src="https://api.zenovay.com/z.js"></script>

Las propias analíticas de miembros de Ghost usan cookies first-party de todos modos, por lo que combinar Zenovay en modo sin cookies es un patrón habitual: conserva los datos de miembros basados en correo electrónico de Ghost, además de obtener analíticas de visitantes sin cookies en el resto del sitio.

Consulte Cumplimiento de Privacidad para un análisis completo.

Recursos relacionados

¿Necesita ayuda? Contacte a [email protected] o visite nuestro Centro de ayuda.

¿Fue útil esta página?