Installing Trackingplan

Installing Trackingplan

Installing Trackingplan

There are several ways you can install Trackingplan. All paths are simple and straightforward and can be completed in only a few minutes.

To choose your installation method, just pick the option* that suits you best:

For Web:

For App:

*Note: Depending on your business needs, installations for both web and app might be required.

Using Google Tag Manager

If you are using a Tag Manager, installing Trackingplan can be done even without having access to your site’s code. Here is how:

  1. Log in to Google Tag Manager.
  2. Create a New tag inside the container connected to your website.
  3. Hover over the Tag Configuration box and click on the gray pencil icon.
  4. image
  5. Next, you can choose the tag type. Select Custom HTML Tag as the tag type.
  6. image
  7. Now, let’s configure your tag. To do this, paste your Trackingplan snippet into the HTML text box in Google Tag Manager. Remember that you can always retrieve your snippet from https://panel.trackingplan.com/plans/”your TP_ID”/install
image
  1. Then, set up your tag’s advanced settings. Click Advanced Settings and set Tag firing Priority to 1000 and Tag Firing Options to Once per page to ensure Trackingplan can see events that trigger once the page has loaded.
  2. image
  3. Next, navigate to the Triggering box and click on the gray pencil icon to choose a trigger. For the best results, select All Pages.
  4. image
    image
  5. Once saved, Trackingplan will load on any page where the Google Tag Manager container script is installed. Remember to Submit your changes!
  6. image
    image

That's it! Now Trackingplan will automatically monitor and document all the customer data you are using for your analytics, marketing, and sales.

Add a Snippet to Your Site Code

To install Trackingplan by adding a snippet to your site code, please follow these steps:

  1. Retrieve your snippet from https://panel.trackingplan.com/plans/”your TP_ID”/install
  2. Paste the snippet into the top of the <head> section of all of your pages, before any tracking code.

Once installed, Trackingplan will automatically verify the data you send to your third-party services without modifying or slowing anything down. This will ensure your tracking plan is always updated and any inconsistencies or errors can be easily identified.

Note: If you are not using a content management system (CMS) like Webflow or WordPress, we recommend asking a developer to add the snippet to your pages. Incorrect installation will prevent Trackingplan from detecting relevant data.

As a Segment Destination

You can also create a new Webhook destination and use the Trackingplan Segment Webhook URL as the Webhook URL.

Your Segment Trackingplan Webhook URL is:

https://tracks.trackingplan.com/webhook/v1/”your TP_ID”?provider=segment

For more guidance, follow the steps below:

  1. Log in to your Segment account and your workspace.
  2. On your Destinations page, click Add Destination.
  3. image
  4. Search for "webhooks" and click on the Webhooks Raw Data destination. Then, click on the Configure Webhooks Button.
  5. image
    image
  6. Pick the source you’d like to use with Trackingplan. If want to add more than one source, you can repeat this process. Then click Next.
  7. image
  8. Name your destination 'Trackingplan' (or the name you want to use to identify it). Then, select 'Fill in settings manually'. To finish this step, click Save.
  9. image
  10. Now we are going to add the webhook endpoint. To start, select Webhooks (max 5).
  11. image
  12. Next, paste your Segment Trackingplan Webhook URL into the Webhook URL field. Then click Save.
  13. image
  14. To finish the installation process, enable your destination using the toggle.
  15. image

And that's it! Now all your Segment Events, Pages, and Identify Calls will be monitored and documented automatically within Trackingplan.

iOS SDK

The recommended way to install Trackingplan for iOS is to use Swift Package Manager, as it will simplify the process of installing and upgrading Trackingplan. To do this, follow the steps below.

If you prefer to install the Trackingplan SDK with Cocoapods, click here.

  1. In Xcode, add the Trackingplan dependency by navigating to File -> Swift Packages -> Add Package Dependency...
image
  1. If you’re asked to choose a project, select the project you want to add Trackingplan to. If not, proceed to step 3.
image
  1. Choose a package repository. To choose Trackingplan’s repository, copy and paste https://github.com/trackingplan/trackingplan-ios into the search box and click Next.
image
  1. Choose Version in the Rules section. The latest version of Trackingplan will auto-populate by default. Click Next.
    • To install previous versions of Trackingplan, you can manually complete this field with the appropriate version information.
image
  1. Check the box next to Trackingplan and click Finish.
image
  1. Verify that the Trackingplan library has been added to the Swift Package Dependencies section.
image
  1. In your application delegate’s - application(_:didFinishLaunchingWithOptions:) method, set up the SDK like so:
  1. Import the SDK with the following command:

All set! You have successfully installed the Trackingplan iOS SDK.

Installing iOS SDK with Cocoapods

Trackingplan also supports iOS installation using Cocoapods. To install Trackingplan with Cocoapods, complete the following steps.

  1. Add the Trackingplan dependency to your Podfile using the following code:
  1. In your application delegate’s - application(_:didFinishLaunchingWithOptions:) method, set up the SDK like so:
  1. Import the SDK with this command:

And that’s it! After completing these steps, you have finished installing the Trackingplan SDK.

Install iOS SDK in a Flutter project

TrackingPlan iOS platform dependency can be managed using Cocoapods (https://guides.cocoapods.org/using/getting-started.html#getting-started)

Your Flutter project is not using cocoapods yet?

  • Move to the ios folder inside your flutter project folder. {project_name}/ios/
  • Initialise cocoapods: $ pod init : this will create the Podfile.

Install:

  • Open the Podfile, uncomment and set the platform and version at the top.
    • platform :ios, '13.0.0'
  • Add line for the Trackingplan pod inside the target block:
    • pod 'Trackingplan', :git => 'https://github.com/trackingplan/trackingplan-ios.git'
  • Make sure that use_frameworks! is in place to disable dynamic frameworks

Sample Podfile (Project without Cocoapods):

  • Move to the ios folder path {project_name}/ios/ and run the command $ pod install

Sample Podfile(Project already using Cocoapods):

Setup:

  • Include Pods files in debug and release config:
    • Edit the file {project_name}/ios/Flutter/Debug.xcconfig and add at the end:
    • #include "Pods/Target Support Files/Pods-Runner/Pods-Runner.debug.xcconfig”

    • Edit the file {project_name}/ios/Flutter/Release.xcconfig and add at the end:
    • #include "Pods/Target Support Files/Pods-Runner/Pods-Runner.release.xcconfig" #include "Pods/Target Support Files/Pods-Runner/Pods-Runner.profile.xcconfig"

  • Update AppDelegate.swift in {project_name}/ios/Runner/
    • Import tracking plan at the top
    • image
    • Initialise tracking plan with the identifier provided inside the didFinishLaunchingWithOptions

Android SDK

The recommended way to install Trackingplan for Android is to use Android Studio.

Note: Before starting the installation process, make sure your project targets API level 21 (Lollipop) or later.

To install Trackingplan in Android Studio, complete the following steps:

  1. Add the Trackingplan dependency. To do this, expand the Gradle Scripts section.
image

  1. Then select the project-level build.gradle file and add com.trackingplan.client:adapter:1.1.2 as a classpath dependency to the dependencies section:
  1. After that, select the module-level build.gradle file and modify it as indicated below:
  • Add id 'com.trackingplan.client' to the plugins section.
  • Add implementation 'com.trackingplan.client:sdk:1.1.2' to the dependencies section.
  1. In the onCreate method of your Application's Main Activity, set up the SDK like so:
  1. Then import the SDK with the following command:

You have now successfully installed the Trackingplan Android SDK.

Build from Source Code

To build Trackingplan’s SDK from source code, clone this repository to a local directory in your machine: https://github.com/trackingplan/trackingplan-android.

After that, open a terminal in that directory and run:

To use this custom build, modify your project-level build.gradle file as indicated below:

Remember to change the version of Trackingplan in your dependencies to 1.0.0-SNAPSHOT.

Install Android SDK in a Flutter project

To add Trackingplan to your flutter app, find the android directory inside your flutter project and add the Trackingplan dependency like so:

  • Add com.trackingplan.client:adapter:1.3.0 as a classpath dependency to the dependencies section of the android/build.gradle file.
  • Add implementation 'com.trackingplan.client:sdk:1.3.0' to the dependencies section of the android/app/build.gradle file.
  • Apply com.trackingplan.client plugin in your android/app/build.gradle file.

Finally, find the MainActivity class (android/app/src/main/kotlin) and, in the onCreate method, set up the SDK like so:

Trackingplan.init("YOUR_TP_ID").start(this)

And of course, import the SDK:

import com.trackingplan.client.sdk.Trackingplan;

All set!

For further information, please check https://github.com/trackingplan/trackingplan-android.

Advanced Options

Trackingplan for Android supports the same Advanced Options as Trackingplan for Web.

For instance, to set a source alias and turn on debug mode, use the following script:

Additionally, there is a dryRun option available that lets you test Trackingplan for Android without actually sending any data to Trackingplan.

Content Security Policies

Content Security Policies are delivered as a header to your users' browser by your web server and are used to declare which dynamic resources are allowed to load on your page.

For many websites, this is often as straightforward as declaring that only scripts/styles from your own domain and the tools you use are allowed. However, this can become more intricate when complex setups are in play.

If you identify CSP errors on your site, there is currently no workaround and you will need to work with your development team or hosting provider to adjust your CSP settings.

Step 1. Check to see if there are CSP errors.

You can check your browser network tab console by following the steps in this guide.

If there is a Content Security Policy issue, you will see something similar to the below error:

image

Step 2. Consult with your web developer or hosting provider to adjust CSP settings.

Since all servers are different, Trackingplan Support won't be able to help troubleshoot any issues with this process. When making changes to your Content Security Policies, the best person to reach out to is your web developer, or whoever manages your website.

Step 3. Choose which CSP settings to adjust.

If you are using a default CSP then adding the below to your default-src rules will be sufficient.

The "..." in the examples below is a placeholder for any existing rules you might have in place:

If you want stricter restrictions, we recommend the template below to ensure your policies are more future-proof as we expand our services. Here's an example of what that would look like:

If your CSPs require more granularity, these are the absolute minimum security allowances you need to add to your web server to allow Trackingplan to function properly on your site:

I’ve just installed Trackingplan. Now what?

Hurray! Your Trackingplan is now ready. Have a look at the documentation below to continue squeezing the value of your data to the max:

  • Do a tour through your Dashboard here.
  • Configure your settings to customize your tracking plan here.
  • Share your plan and align with and across other members of your organization here.

← Previous

Overview
Overview

Next →

Settings
Settings