Installation guide

Install on Bubble

Add the tracking snippet to your Bubble app. Takes under 2 minutes.

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. 1In the Bubble editor, open the page you want to track.
  2. 2In the Design tab, find HTML in the Visual Elements section of the left panel.
  3. 3Drag an HTML element onto the page canvas.
  4. 4Double-click the element to open the HTML editor.
  5. 5Paste your tracking snippet into the HTML field.
  6. 6Resize the element to 0×0 (or set it to not be visible) so it does not affect your layout.
  7. 7Repeat 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. 1Go to the Design tab and click Add a new reusable element.
  2. 2Name it something like AEOfix Tracker.
  3. 3Inside the reusable element, add an HTML element containing your tracking snippet.
  4. 4Go to each page and drag the AEOfix Tracker reusable element from the Components section onto the canvas.
  5. 5Make 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. 1Click Preview in the Bubble editor to open your app in the browser.
  2. 2Open browser DevTools (F12) and go to the Network tab.
  3. 3Filter requests by typing bot-pixel in the filter bar.
  4. 4You should see a GET request returning a 200 status — installation is confirmed.