> ## Documentation Index > Fetch the complete documentation index at: https://docs.datalyr.com/llms.txt > Use this file to discover all available pages before exploring further. # Framer > Add DATALYR tracking to your Framer site in 2 minutes Add DATALYR to your Framer site to track visitors, conversions, and revenue from ads. ## Use Cases **Landing Pages** Track ad campaign performance for product launches, waitlists, and marketing campaigns. **Portfolios & Agency Sites** Monitor visitor behavior, traffic sources, and contact form conversions. **SaaS Marketing Sites** Track signups, demo requests, and trial conversions from paid ads. **Product Pages** See which ads drive the most engagement and conversions on product pages. ## Before You Start * [ ] You have a DATALYR account * [ ] You've created a workspace * [ ] You have a Framer site (free or paid plan) * [ ] You have edit access to your Framer project ## Step 1: Get Your Tracking Code 1. Log in to your DATALYR dashboard 2. Go to **Settings → Tracking** 3. Copy your tracking script: ```html theme={null} ``` ## Step 2: Add to Framer Site Settings 1. Open your Framer project 2. Click the **Settings** icon (gear) in the top toolbar 3. Go to the **General** tab 4. Scroll down to **Custom Code** 5. In the **Start of `` tag** section, paste your DATALYR tracking script 6. Click outside the text area to save ## Step 3: Publish Your Site The tracking script only runs on your **published** site, not in the Framer editor preview. 1. Click **Publish** in the top right 2. Confirm your site settings 3. Click **Publish** ## Step 4: Verify Tracking Works 1. Visit your published Framer site in a new browser tab 2. Go back to your DATALYR dashboard 3. Click **Events** in the sidebar 4. You should see a `page_view` event within 10 seconds If you see events, you're done! ## What Gets Tracked Automatically Once installed, DATALYR automatically captures: * Page views on all pages * Visitor IDs (persistent across sessions) * UTM parameters from ad campaigns * Ad click IDs (fbclid, gclid, ttclid) * Referrer and traffic source * Device and browser information ## Track Framer Form Submissions To track form submissions, add a custom code component to your form's success state: ### Using Framer's Built-in Forms 1. Select your form element in Framer 2. Add a **Custom Code** component below the form 3. Paste this code: ```html theme={null} ``` 4. Replace `'Contact Form'` with your actual form name 5. Publish your site ### Track Button Clicks Track specific button clicks or interactions: ```html theme={null} ``` Replace `[data-framer-name="DemoButton"]` with your actual button's data attribute. ## Track Page-Specific Events Add custom code to individual pages: 1. Select the page in your Framer project 2. Click **Page Settings** (gear icon) 3. Go to **Custom Code** 4. Add your tracking code in **End of `` tag**: ```html theme={null} ``` ## Track External Link Clicks Track when users click links to external sites: ```html theme={null} ``` ## Identify Users If you collect email addresses or user IDs, identify users for cross-device tracking: ```html theme={null} ``` ## Troubleshooting **Not seeing events?** Check that: * Your tracking script is in **Start of `` tag** (not End of ``) * You've **published** your site (tracking doesn't work in editor preview) * Your workspace ID is correct * Ad blockers are disabled **Custom code not working?** Make sure: * Your code is wrapped in `