# Apply to GTM

### Overview

```
Design flow in Taviqo
        ↓
Export GTM JSON
        ↓
Import JSON into GTM
        ↓
Test with GTM Preview
        ↓
Publish in GTM
```

***

### 1. Install GTM in your project

If GTM is not yet installed in your project, add the installation code first.

#### Next.js

```tsx
// app/layout.tsx
import { GoogleTagManager } from '@next/third-parties/google'

export default function RootLayout({ children }) {
  return (
    <html>
      <head />
      <body>
        {children}
        <GoogleTagManager gtmId="GTM-XXXXXX" />
      </body>
    </html>
  )
}
```

#### HTML

```html
<!-- Add to <head> -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');</script>

<!-- Add to <body> -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
```

> 💡 Your GTM Container ID (GTM-XXXXXX) can be found in your GTM account dashboard.

***

### 2. Add dataLayer event code

Copy the auto-generated code from Taviqo's **Code Snippets** panel and add it to the relevant actions in your project.

```typescript
// Example: When a project is created
window.dataLayer?.push({
  event: 'create_project',
  project_id: project.id,
  source_page: 'dashboard',
})
```

See Code Snippets for more details.

***

### 3. Export GTM JSON from Taviqo

1. Open your workspace canvas
2. Click the **project name dropdown** at the top
3. Click **Export GTM JSON**
4. JSON file downloads automatically

\[📸 IMAGE: Export GTM JSON dropdown menu screenshot]

***

### 4. Import JSON into GTM

1. Go to [tagmanager.google.com](https://tagmanager.google.com)
2. Select your container
3. Go to **Admin** → **Import Container**
4. Upload the downloaded JSON file
5. Select workspace: **Existing workspace**
6. Import option: Select **Merge**

\[📸 IMAGE: GTM import container screen screenshot]

> ⚠️ Always choose **Merge** instead of **Overwrite**. Overwrite will delete your existing tags and triggers.

***

### 5. Test with GTM Preview

1. Click **Preview** in GTM
2. Enter your site URL and connect
3. Verify each event fires the correct tags
4. If everything looks good, click **Publish**

\[📸 IMAGE: GTM Preview mode screenshot]


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://taviqo.gitbook.io/taviqo-docs/getting-started/apply-to-gtm.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
