How Bubble works with tracking

Bubble renders apps as single-page applications (SPA). AI bots typically crawl the public-facing pages of Bubble apps — marketing pages, landing pages, and public content. The AEOfix tracking snippet fires on each page load and captures the current URL via location.pathname, giving you accurate per-page bot data.

1 Method 1 — HTML Element Recommended

Place an HTML element directly on each page you want to track. This is the quickest method for tracking a small number of pages.

1 In the Bubble editor, open the page you want to track.
2 In the Design tab, find HTML in the Visual Elements section of the left panel.
3 Drag an HTML element onto the page canvas.
4 Double-click the element to open the HTML editor.
5 Paste your tracking snippet into the HTML field.
6 Resize the element to 0×0 (or set it to not be visible) so it does not affect your layout.
7 Repeat for each page you want to track.

Your tracking snippet

<script>(function(){var i=document.createElement('img');i.width=1;i.height=1;i.style.display='none';i.alt='';i.src='https://aeofix.com/api/bot-pixel?page='+encodeURIComponent(location.pathname)+'&site=YOUR_SITE_ID';document.body.appendChild(i);})();</script>

Note: Bubble apps are SPAs — the HTML element fires when each page loads. Add it to every page you want tracked, or use a reusable element (Method 2 below) for a DRY, site-wide approach.

2 Method 2 — Reusable Element All pages at once

Track all pages without repeating yourself. Create a Reusable Element containing the HTML snippet, then drop it onto each page once — or use it as a component inside your main template.

1 Go to the Design tab and click Add a new reusable element.
2 Name it something like AEOfix Tracker.
3 Inside the reusable element, add an HTML element containing your tracking snippet.
4 Go to each page and drag the AEOfix Tracker reusable element from the Components section onto the canvas.
5 Make it invisible: set width and height to 0 and use Send to back in the layout options.

SPA navigation note

Bubble's SPA navigation means page changes do not reload the full HTML document. The location.pathname in the snippet captures the current URL correctly on initial page load, which is sufficient for AI bot tracking — bots typically access pages via direct URL, not SPA navigation events.

⚠ Note: If you need to track soft navigations (user clicks between pages within the SPA), a more advanced approach would be required. For AI bot tracking purposes, per-page HTML elements are sufficient — bots request each page URL directly and trigger the snippet on load.

Verify it's working

Preview your Bubble app in the browser, then confirm the snippet is firing:

1 Click Preview in the Bubble editor to open your app in the browser.
2 Open browser DevTools (F12) and go to the Network tab.
3 Filter requests by typing bot-pixel in the filter bar.
4 You should see a GET request returning a 200 status — installation is confirmed.