---
title: Getting Started - Capacitor
description: Integrate Contentsquare SDKs into your Capacitor apps in minutes (installation, user consent, screen tracking, and testing)
lastUpdated: 11 March 2026
source_url:
html: https://docs.contentsquare.com/en/capacitor/
md: https://docs.contentsquare.com/en/capacitor/index.md
---
Welcome to the SDK implementation guide!
This guide is designed to help you seamlessly integrate our SDK into your application. By following the outlined steps, you’ll be able to collect and analyze data from your app, within just a few minutes.
## Install the SDK
The SDK is shipped as a Capacitor plugin which you need to add as a dependency to your Capacitor application.
See [Compatibility](compatibility/) for more information.
### Include the SDK
Install the plugin as follows, specifying the exact version you want to install if needed:
```shell
npm install @contentsquare/capacitor-plugin
npx cap sync
```
You do not need to do anything to start the SDK. Now that the SDK is a dependency of your app, it will autostart itself when your application starts.
### Validate SDK integration
Start your application, and check logs for this output:
* Android Studio
```text
CSLIB: Contentsquare SDK 7.0.0 starting in app: com.example.testapp
```
* Xcode
```text
CSLIB ℹ️ Info: Contentsquare SDK v7.0.0 starting in app: com.example.testapp
```
## Check the logs
Contentsquare provides logging capabilities that allow you to inspect the raw event data logged by your app in Android Studio, Xcode, or on the Contentsquare platform.
To view all logs, you must [enable in-app features](#enable-in-app-features): logging is linked to in-app features being enabled or disabled.
### Viewing local logs in IDE
* Android
To view SDK logs:
1. Plug your Android phone into your computer (or use an emulator)
2. Open Android Studio and start your app
3. Open the `Logcat` view and select your phone or emulator
4. Filter logs by `CSLIB`
* iOS
1. Unless you are using a simulator, ensure the device you are using is connected to your Mac or is on the same Wi-Fi network.
2. Open the macOS Console app or Xcode.
For the macOS Console app, make sure info messages are included at [Choose Action > Include Info Messages ↗](https://support.apple.com/guide/console/customize-the-log-window-cnsl35710/mac).
3. Filter logs by `CSLIB`.
### Implement in app-features
Note
This step only applies to iOS.
In-app features are essential for your implementation, as it includes key functionalities like screenshot creation and replay configuration.
To allow Contentsquare users to enable in-app features, perform these tasks:
1. [Add the custom URL scheme in your app Info](#1-add-the-custom-url-scheme-in-your-app-info)
2. [Call the SDK when the app is launched via a deeplink](#2-call-the-sdk-when-the-app-is-launched-via-a-deeplink)
#### 1. Add the custom URL scheme in your app Info
You have to allow your app to be opened via a custom URL scheme which can be done using one of the following methods:
##### Xcode
1. Open your project settings
2. Select the app target
3. Select the `Info` settings
4. Scroll to `URL Types`
5. Set the URL scheme to `cs-$(PRODUCT_BUNDLE_IDENTIFIER)`
##### Text editor
1. Open the `Info.plist` of your project
2. Add the following snippet:
**Info.plist**
```xml
CFBundleURLTypes
CFBundleURLSchemes
cs-$(PRODUCT_BUNDLE_IDENTIFIER)
```
#### 2. Call the SDK when the app is launched via a deeplink
Depending on the project, there are multiple ways to handle the deeplink opening. Choose the method matching your project structure:
* AppDelegate
In your `AppDelegate` class, complete or implement the function `application(app, open url:, options:)` with: `Contentsquare.handle(url: url)`
* SceneDelegate
In your `WindowSceneDelegate` class, you need to:
1. Update `func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions)` with:
```swift
if let url = connectionOptions.urlContexts.first?.url {
Contentsquare.handle(url: url)
}
```
2. Complete or implement `func scene(_ scene: UIScene, openURLContexts URLContexts: Set)` with:
```swift
if let url = URLContexts.first?.url {
Contentsquare.handle(url: url)
}
```
* SwiftUI
In the `body` of your main App struct, add the `onOpenURL` modifier and call the `Contentsquare` SDK to handle the URL:
```swift
@main
struct MyApp: App {
var body: some Scene {
WindowGroup {
MyView()
.onOpenURL { url in
Contentsquare.handle(url: url)
}
}
}
}
```
### Enable in-app features
To enable in-app features within your app, you have to **first make sure your app is launched in the background**. Then, follow the appropriate method described as follows.
#### On a device: scan the QR code
* Android
In Contentsquare, select the Mobile icon in the menu top bar and scan the QR code with your phone.
* iOS
In Contentsquare, select the Mobile icon in the menu top bar and scan the QR code with your phone.
#### On an emulator/simulator
* Android
In Contentsquare, select the Mobile icon in the menu top bar then select your application ID, and "Copy this ADB command".
* iOS
In Contentsquare, select the Mobile icon in the menu top bar then select your Bundle ID, and select "Copy this link". Paste it in Safari on your simulator to trigger the in-app features.
### Contentsquare Log Visualizer
Log Visualizer is a feature integrated into the Contentsquare SDK. As you navigate and interact with your app, it provides a live view of events detected by the SDK, visible directly on the [Contentsquare platform ↗](https://app.contentsquare.com/#/analyze/mobile-log).
Prerequisite
To use Log Visualizer, `Activate SDK logs stream` must be toggled on within in-app settings.
1. Start your app.
2. Select the Mobile icon in the menu top bar then select `Log Visualizer`.
3. Select the device to inspect.
At this stage, you should see an 'App start' or 'App show' event being logged.
* Android
* iOS
## Get user consent
Contentsquare collects usage data from your app users. To start tracking, you need your users' consent for being tracked.
Warning
You are responsible for handling the UI asking users for their consent and allowing them to manage their privacy settings. Consult our [Privacy Center ↗](https://contentsquare.com/privacy-center/) and [Privacy Policy ↗](https://contentsquare.com/privacy-center/privacy-policy/).
### User opt-in
The SDK treats users as **opted-out by default.**
Forward user consent with `optIn()`. Calling this method generates a user ID and initiates tracking.
```javascript
import { ContentsquarePlugin } from "@contentsquare/capacitor-plugin";
ContentsquarePlugin.optIn();
```
Going further
For advanced configuration regarding user consent or personal data handling, see [Privacy](https://docs.contentsquare.com/en/capacitor/privacy/).
## Track your first screens
Contentsquare aggregates the user behavior and engagement at the screen level. Start your SDK implementation by tracking key screens like the home screen, product list, product details, or conversion funnel.
### Sending screenview events
Screen tracking is achieved by sending a `screenview` event each time a new screen is displayed on the user's device.
```javascript
import { ContentsquarePlugin } from "@contentsquare/capacitor-plugin";
ContentsquarePlugin.sendScreenName(screenName).catch((err) => {
// Handle error
});
```
### Implementation recommendations
From a functional perspective, a screenview should be triggered in the following cases:
* When the screen appears on the device
* When a modal or pop-up is displayed
* When a modal or pop-up is closed, returning the user to the screen
* When the app is brought back to the foreground (after being minimized)
#### Screen name handling
It is necessary to provide a name for each screen when calling the screenview API.
As a general rule, keep distinct screen names under 100. As they are used to map your app in Contentsquare, you will want something comprehensive. The screen name length is not limited on the SDK side. However, the limit is 2083 characters on the server side.
More on [screen name handling](https://docs.contentsquare.com/en/capacitor/track-screens/#how-to-name-screens).
Tracking plan
To get the most out of your data, it’s best to follow a tracking plan. This way, you’ll capture every step of the user’s journey without missing important interactions, giving you a complete picture of how your app is used.
## Test your setup
Testing your SDK implementation is essential to make sure data is being accurately captured and reported.
To test your setup, simulate user interactions in your app and check that the events are logged correctly in our analytics platform.
You can also use debugging tools such as Android Studio, Xcode, or Log Visualizer to monitor data transmission and ensure everything is running smoothly.
### Visualize events in Contentsquare
Use [Log Visualizer](#contentsquare-log-visualizer) to view incoming events within the Contentsquare pipeline. This allows you to monitor the stream in real time.
By simulating user activity, you see incoming screenview and gesture events.
* Android
* iOS
### Visualize data in Contentsquare
Data availability
Data must be sessionized (meaning all events for a single session are gathered together) before it can be visualized. This requires the session to have ended, which happens 30 minutes after the last event is received. Therefore, you can expect to see the first replays 30 minutes after the last interaction with the app.
#### In Journey Analysis
[Open Journey Analysis ↗](https://app.contentsquare.com/#/analyze/navigation-path) in Contentsquare and visualize the user journeys main steps across your app, screen by screen.
See how to use Journey Analysis on the [Help Center ↗](https://support.contentsquare.com/hc/en-us/articles/37271761254161).
#### In Session Replay
[Open Session Replay ↗](https://app.contentsquare.com/#/session-replay) in Contentsquare and replay the full user session across your app.
See how to use Session Replay on the [Help Center ↗](https://support.contentsquare.com/hc/en-us/articles/37271667148561)
## Sample app
To explore some of these features in context, check our Capacitor sample app.
### [capacitor-sample-app](https://github.com/ContentSquare/capacitor-sample-app)
[A sample app giving an example implementation of the Contentsquare SDK](https://github.com/ContentSquare/capacitor-sample-app)
[TypeScript](https://github.com/ContentSquare/capacitor-sample-app)
## Next steps
While screen tracking gives an overview of user navigation, capturing session, screen, or user metadata provides a deeper understanding of the context behind user behavior.
Our SDK offers a wide range of features to enhance your implementation, including Session Replay, Error Monitoring, extended tracking capabilities, and personal data masking.
Proceed with these how-to’s to refine your implementation.
[Dynamic Variables ](https://docs.contentsquare.com/en/capacitor/track-dynamic-variables/)Collect additional information about the session.
[Transactions tracking ](https://docs.contentsquare.com/en/capacitor/track-transactions/)Associate user’s session with their potential purchases and corresponding revenue.
[Session Replay ](https://docs.contentsquare.com/en/capacitor/session-replay/)Collect data for Session Replay in compliance personal data masking.
[Error Analysis ](https://docs.contentsquare.com/en/capacitor/error-analysis/)Track API errors and application crashes with automated collection and privacy-safe debugging tools.