Panduan Memulai

Instalasi

Anda bisa menggunakan AI-Assisted Setup kami untuk menginstal plugin ini. Tambahkan skill Capgo ke tool AI Anda dengan command berikut:

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

Lalu gunakan prompt berikut:

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

Jika Anda lebih memilih Manual Setup, instal plugin dengan menjalankan perintah berikut dan ikuti petunjuk khusus platform di bawah ini:

1. Install 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. Sync platform native

   npm

   npx cap sync

   pnpm

   pnpm cap sync

   yarn

   yarn cap sync

   bun

   bunx cap sync

3. Tinjau konfigurasi produk upstream

   • Ikuti panduan resmi Panduan Capacitor Contentsquare untuk project keys, replay settings, dan setup dashboard.

Mulai cepat

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

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

Kesalahan umum

• Hormati persetujuan pengguna sebelum optIn.
• Konfigurasi dashboard keys.
• Patuhi aturan privasi replay.

Penggunaan dasar

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',
});

Tips penamaan screen

• Gunakan nama yang stabil, bukan nilai spesifik per user.
• Gunakan konvensi penamaan yang sama di stack navigasi iOS dan Android.
• Saat aplikasi kembali ke foreground, kirim ulang nama layar dan variabel dinamis yang penting.

Kontrol privasi Replay

Gunakan masking helper bawaan agar konten sensitif tidak masuk ke 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' }],
});

Setup platform

• Untuk fitur in-app iOS, selesaikan konfigurasi deeplink tambahan di Setup iOS .
• Android tidak butuh konfigurasi manifest tambahan untuk plugin ini; lihat Catatan Android untuk tips logging dan validasi.

Catatan

• Plugin ini adalah port komunitas Capacitor 8 dari paket resmi Contentsquare Capacitor.
• JavaScript API tetap selaras dengan dokumentasi Contentsquare Capacitor saat ini, sementara setup packaging dan build native menargetkan Capacitor 8.

Lanjutkan dari Getting Started

Jika Anda menggunakan Panduan Memulai untuk merencanakan pekerjaan plugin native, hubungkan dengan Menggunakan @capgo/capacitor-contentsquare untuk kapabilitas native dalam Menggunakan @capgo/capacitor-contentsquare, Direktori Plugin Capgo untuk alur kerja produk di Direktori Plugin Capgo, Plugin Capacitor oleh Capgo untuk detail implementasi pada Capacitor Plugins oleh Capgo Menambahkan atau Memperbarui Plugin untuk detail implementasi di Menambahkan atau Memperbarui Plugin, dan Alternatif Plugin Ionic Enterprise untuk alur kerja produk dalam Alternatif Plugin Ionic Enterprise.