7 min de lecture

Intégration Squarespace

Ajoutez Zenovay à votre site Squarespace via le panneau Code Injection. L'intégration est sans code, fonctionne sur tous les templates Squarespace et respecte la bannière de consentement GDPR/CCPA de Squarespace nativement.

Code Injection nécessite un plan Business ou supérieur (23 $/mois+). Les plans Personal n'exposent pas Code Injection.

Démarrage rapide

Étape	Où	Ce que vous faites
1	Tableau de bord Zenovay	Copiez votre snippet de suivi
2	Admin Squarespace → Settings → Advanced → Code Injection	Collez-le dans Header
3	Sauvegardez	Cliquez sur Save en haut du panneau
4	Tableau de bord Zenovay	Les visiteurs en temps réel apparaissent en ~30 secondes

Méthode 1 : Code Injection pour tout le site (recommandée)

Le panneau Code Injection de Squarespace écrit du HTML brut dans le <head> de chaque page. C'est la méthode prise en charge pour ajouter tout pixel d'analytics ou de marketing tiers.

Étape par étape

Connectez-vous à votre panneau d'administration Squarespace.
Dans le menu principal, cliquez sur Settings.
Faites défiler vers le bas et cliquez sur Advanced.
Cliquez sur Code Injection.
Collez le snippet Zenovay dans le champ Header :

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

Cliquez sur Save en haut du panneau.

Vérifier

Ouvrez votre site en ligne dans une fenêtre de navigation privée et consultez le code source. Recherchez <script defer data-tracking-code=...> entre <head> et </head>. Votre visite devrait apparaître dans la vue en temps réel Zenovay en ~30 secondes.

Méthode 2 : Code Injection par page (plans Premium / Business)

Si vous souhaitez ne suivre que des pages spécifiques, utilisez l'injection par page :

Dans l'admin, survolez la page dans le panneau Pages.
Cliquez sur l'icône d'engrenage pour ouvrir Page Settings.
Ouvrez l'onglet Advanced.
Collez le snippet dans le champ Page Header Code Injection.
Sauvegardez.

L'injection par page s'exécute après l'injection à l'échelle du site. Ne collez pas le tracker dans les deux portées — vous double-compterez.

Suivi des événements personnalisés

Une fois le tracker chargé, vous pouvez appeler window.zenovay() depuis n'importe quel bloc de code sur une page.

Suivre les clics sur des CTA

Dans l'éditeur de page, ajoutez un bloc Code à côté de votre bouton.
Définissez le langage sur HTML.
Collez :

<script>
  document.addEventListener('DOMContentLoaded', () => {
    const cta = document.querySelector('[data-zv-cta="hero"]');
    if (!cta || !window.zenovay) return;
    cta.addEventListener('click', () => {
      window.zenovay('track', 'cta_clicked', { location: 'hero', page: location.pathname });
    });
  });
</script>

Ajoutez un attribut data-zv-cta="hero" à votre bouton en éditant ses paramètres de bloc (certains templates nécessitent d'encapsuler le bouton dans un bloc Code pour attacher des attributs bruts).

Suivre les soumissions de formulaires

Les formulaires natifs Squarespace émettent un événement Y.Mojito.SquarespaceFormFront auquel vous pouvez vous connecter, mais l'approche la plus simple et compatible avec tous les templates consiste à écouter l'événement submit :

<script>
  document.addEventListener('DOMContentLoaded', () => {
    document.querySelectorAll('form[data-form-id]').forEach(form => {
      form.addEventListener('submit', () => {
        if (window.zenovay) {
          window.zenovay('track', 'form_submitted', {
            form_id: form.getAttribute('data-form-id'),
            page: location.pathname,
          });
        }
      });
    });
  });
</script>

Identifier les clients connectés (Member Areas)

Si vous utilisez Squarespace Member Areas, vous pouvez identifier les clients après leur connexion. Ajoutez ceci dans Code Injection → Footer (pour qu'il s'exécute après que Squarespace hydrate le contexte membre) :

<script>
  document.addEventListener('DOMContentLoaded', () => {
    const memberId = window.SquarespaceMemberAccountContext?.context?.memberId;
    const email = window.SquarespaceMemberAccountContext?.context?.emailAddress;
    if (memberId && window.zenovay) {
      window.zenovay('identify', { userId: memberId, email });
    }
  });
</script>

La surface de contexte Squarespace interne est disponible dans la limite du possible — encapsulez-la dans try/catch si vous en dépendez.

Suivi des achats Squarespace Commerce

Pour les boutiques Squarespace Commerce, déclenchez un événement purchase sur la page de confirmation de commande :

Allez dans Settings → Advanced → Code Injection.
Dans le champ Order Confirmation Page (pas le champ Header habituel), collez :

<script>
  document.addEventListener('DOMContentLoaded', () => {
    const orderId = document.querySelector('[data-order-id]')?.dataset.orderId
                 || window.location.pathname.split('/').pop();
    const total = document.querySelector('.order-total .price')?.textContent;
    const revenue = parseFloat((total || '').replace(/[^0-9.]/g, ''));
    if (window.zenovay && revenue > 0) {
      window.zenovay('track', 'purchase', {
        transaction_id: orderId,
        revenue,
        currency: 'USD',
      });
    }
  });
</script>

Pour une attribution de revenus précise incluant les remboursements et abonnements, préférez les webhooks Stripe côté serveur — la solution de repli côté client ci-dessus manque les commandes dont les acheteurs ferment l'onglet avant l'affichage de la page de confirmation.

Exigences du plan

Plan	Code Injection	Injection par page	Événements Commerce
Personal	❌	❌	❌
Business	✅	✅	⚠️ Add-on
Basic Commerce	✅	✅	✅
Advanced Commerce	✅	✅	✅ + panier abandonné

Pièges courants

Le plan Personal n'a pas Code Injection. C'est le ticket de support le plus fréquent. Vous avez besoin de Business (23 $/mois) ou supérieur.

Templates Squarespace 7.1 vs 7.0. Les deux prennent en charge Code Injection de manière identique — le chemin de menu est le même. La seule différence : certains templates 7.0 ont une option "Page Header" distincte dans les paramètres au niveau du template ; ignorez-la et utilisez le panneau standard Settings → Advanced → Code Injection.

Pages AMP / verrouillées. Squarespace sert une variante AMP des articles de blog (/?format=amp). Votre tracker ne se chargera pas dessus car AMP supprime les balises <script> arbitraires. Si AMP vous importe, désactivez la livraison AMP dans Settings → Marketing → SEO.

Navigation de type SPA sur certains templates. La plupart des templates Squarespace effectuent des rechargements de page complets sur les clics de liens. Quelques-uns (notamment Brine et Native) ont des transitions de page AJAX qui ne déclenchent pas un nouveau chargement de <head>. Si vous constatez des pages vues sous-comptées sur ces templates, appelez manuellement window.zenovay('trackPageView') depuis un écouteur popstate.

Bannière de consentement aux cookies. Si vous avez activé la bannière de cookies intégrée de Squarespace (Settings → Cookies & Visitor Data), elle ne bloque pas votre Code Injection personnalisé. Pour bloquer Zenovay jusqu'au consentement, utilisez plutôt le mode data-cookieless="true", qui ne nécessite pas de bannière de consentement dans la plupart des juridictions.

Dépannage

Symptôme	Cause probable	Solution
Pas de données, plan Personal	Code Injection désactivé en dessous de Business	Changez de plan
Pas de données	Snippet collé mais non sauvegardé	Cliquez sur Save en haut du panneau Code Injection
Pas de données sur les articles de blog	Variante AMP servie sur votre appareil de test	Désactivez AMP ou testez l'URL canonique
Certaines pages manquantes	Code Injection par page uniquement sur quelques pages	Déplacez le snippet vers le Header global
Pages vues en double	Snippet collé à la fois dans le Header global et le Header par page	Choisissez une seule portée

Confidentialité et conformité

Pour un suivi sans cookies (pas de cookies, pas de stockage local), ajoutez data-cookieless="true" :

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

Consultez la Conformité à la confidentialité pour une vue d'ensemble complète.

Ressources associées

Besoin d'aide ? Contactez [email protected] ou visitez notre Centre d'aide.