Integrating Gooddata with SvelteKit

Adding Gooddata to your SvelteKit project is a simple, straightforward process. Follow the step-by-step instructions below to start tracking your visitors without compromising their privacy.

Step 1: Copy Your Project ID

Before you begin, you need your unique Gooddata Project ID.

Log in to your Gooddata Dashboard.
Select your project from the sidebar.
Click on the Settings gear icon in the bottom left.
Copy the Project ID or the provided tracking snippet block.

Step 2: Add the Script to app.html

SvelteKit uses an app.html file as the base template for every page.

Open src/app.html in your code editor.
Locate the <head> block.
Paste the tracking script just before the closing </head> tag.
Replace <YOUR_PROJECT_ID> with your actual project ID.

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width" />
		%sveltekit.head%
		
    <!-- Add Gooddata here -->
    <script defer data-project-id="<YOUR_PROJECT_ID>" src="https://gooddata-fyp.onrender.com/sdk/tracker.js"></script>
	</head>
	<body data-sveltekit-preload-data="hover">
		<div style="display: contents">%sveltekit.body%</div>
	</body>
</html>

Step 3: Verify the Installation

Once you have added the script and published your changes, it's time to test if Gooddata is receiving data.

Open your live website in a new incognito/private browsing window.
Navigate to a few different pages.
Return to your Gooddata Dashboard and go to the Realtime tab.
You should see "1 Active Visitor" and your recent page views populating instantly.

Troubleshooting: If you don't see any data, make sure you don't have an adblocker enabled that might be blocking the script, and ensure you replaced <YOUR_PROJECT_ID> with your actual ID.

Integrating Gooddata with SvelteKit

Step 1: Copy Your Project ID

Step 2: Add the Script to app.html

Step 3: Verify the Installation

On this page