Prise en main

Installation

Vous pouvez utiliser notre configuration assistée par IA pour installer le plugin. Ajoutez les skills Capgo à votre outil d'IA avec la commande suivante :

npx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Utilisez ensuite le prompt suivant :

Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-contentsquare` plugin in my project.

Si vous préférez une installation manuelle, installez le plugin en exécutant les commandes suivantes et suivez les instructions spécifiques à chaque plateforme ci-dessous :

1. Installer le plugin

   npm

   npm i @capgo/capacitor-contentsquare

   pnpm

   pnpm add @capgo/capacitor-contentsquare

   yarn

   yarn add @capgo/capacitor-contentsquare

   bun

   bun add @capgo/capacitor-contentsquare

2. Synchroniser les plateformes natives

   npm

   npx cap sync

   pnpm

   pnpm cap sync

   yarn

   yarn cap sync

   bun

   bunx cap sync

3. Vérifiez la configuration du produit en amont

   • Suivez le guide officiel de Contentsquare Capacitor pour les clés de projet, les réglages de replay et le setup du dashboard.

Démarrage rapide

import { ContentsquarePlugin } from '@capgo/capacitor-contentsquare';

// Only call optIn() after the user has granted analytics consent.
if (userGrantedAnalyticsConsent) {
  await ContentsquarePlugin.optIn();
}

Erreurs courantes

• Respectez le consentement avant l'optIn.
• Configurez les clés du dashboard.
• Respectez les règles de confidentialité du replay.

Utilisation de base

import { ContentsquarePlugin, CurrencyCode } from '@capgo/capacitor-contentsquare';

const consentGranted = await requestAnalyticsConsent(); // your CMP / ATT flow
if (consentGranted) {
  await ContentsquarePlugin.optIn();
}

await ContentsquarePlugin.sendScreenName('Home');

await ContentsquarePlugin.sendTransaction({
  transactionValue: 29.99,
  transactionCurrency: CurrencyCode.EUR,
  transactionId: 'order-123',
});

await ContentsquarePlugin.sendDynamicVarWithStringValue({
  dynVarKey: 'store',
  dynVarValue: 'rome',
});

Conseils de nommage des écrans

• Use stable names instead of user-specific values.
• Conservez les mêmes conventions de nommage dans les piles de navigation iOS et Android.
• Lorsque l'application repasse au premier plan, renvoyez le nom de l'écran et toute variable dynamique critique.

Contrôles de confidentialité des replays

Utilisez les helpers de masquage intégrés pour exclure le contenu sensible du Session Replay :

await ContentsquarePlugin.excludeURLForReplay('/checkout/');

await ContentsquarePlugin.setCapturedElementsSelector('[data-cs-capture]');

await ContentsquarePlugin.setPIISelectors({
  PIISelectors: ['input[type="email"]', '.credit-card'],
  Attributes: [{ selector: 'input[name="email"]', attrName: 'value' }],
});

Configuration de la plateforme

• Pour les fonctionnalités in-app sur iOS, terminez le paramétrage des deeplinks dans la Configuration iOS page.
• Android ne nécessite pas de configuration supplémentaire du manifeste pour le plugin ; consultez Notes Android pour des conseils sur les logs et la validation.

Notes

• Ce plugin est un portage communautaire Capacitor 8 du package officiel Contentsquare Capacitor.
• L’API JavaScript reste aligné sur la documentation Contentsquare Capacitor actuelle, tandis que le packaging et la configuration du build natif ciblent Capacitor 8.

Continuer depuis Getting Started

Si vous utilisez Prise en main pour planifier le travail sur les plugins natifs, connectez-l’à Utiliser @capgo/capacitor-contentsquare pour la capacité native dans « Utiliser @capgo/capacitor-contentsquare », Capgo Répertoire des plugins pour le workflow produit dans Capgo Plugin Directory, Plugins Capacitor par Capgo pour les détails d'implémentation dans Plugins Capacitor par Capgo, Ajouter ou mettre à jour des plugins pour les détails d'implémentation dans Ajout ou mise à jour de plugins, et Alternatives aux plugins Ionic Enterprise pour le workflow produit dans Alternatives aux plugins Ionic Enterprise.