Bubble.io Installation

Bubble.io allows you to add custom HTML code globally or per-page, making Jetrack integration straightforward.

Global Installation (All Pages)

For site-wide tracking, add the script to your application settings.

Steps

Open your Bubble editor
Click Settings (gear icon) in the left toolbar
Navigate to the SEO / Metatags tab
Find the Script/meta tags in header section
Paste your BrandJet tracking script:

<script
    async
    defer
    data-website-id="your-unique-id"
    src="https://analytics.brandjet.ai/script.js">
</script>

Click Save

Your tracking script now loads on all pages of your Bubble app!

Page-Specific Installation

To track only specific pages:

Open the page in your Bubble editor
Double-click the page background (outside any elements)
In the Element Inspector, scroll to Page HTML Header
Paste your tracking script
The script will only load on that specific page

Using the HTML Element

For inline scripts or dynamic content:

Drag an HTML element from the visual elements panel
Place it on your page
Add your tracking script in the HTML field
Make sure the element is visible

Note: The global header method is recommended for analytics.

Important Notes (2024 Update)

As of July 2024, Bubble changed JavaScript script tags to type "module" for better performance. Your Brand Jet tracking script should work without modifications, but if you encounter issues:

Ensure the script uses async and defer attributes
Avoid using document.write in custom scripts
Use $('head').append() if dynamically adding scripts

What Gets Tracked

BrandJet tracks all Bubble pages including:

Landing pages
User dashboards
Workflows (page loads)
Custom pages
Pop-ups (if they trigger page loads)

Testing

Add the tracking script to your Bubble app
Click Preview to open your app
Navigate through pages
Check your BrandJet dashboard for visitor data

Note: Development mode traffic may be filtered. Test on your live site for accurate results.

Bubble Plans

Custom code in headers requires:

Personal Plan or higher
Some features may require Professional Plan

Check your Bubble plan if the option is disabled.

Troubleshooting

Script Not Loading

Verify you added the script to SEO / Metatags
Clear Bubble's cache: Settings → General → Clear cache
Check browser console for errors

Not Tracking Page Views

Ensure the HTML element is visible (if using inline method)
Verify your website ID is correct
Check that the script appears in page source

Changes Not Appearing

Save your settings
Refresh your Bubble preview
Deploy to live if testing on production

Bubble Responsive Engine

BrandJet works with both:

Classic Bubble Editor
New Responsive Engine

No special configuration needed!

Custom Workflows

BrandJet automatically tracks page navigations in Bubble workflows. Custom event tracking can be added using the BrandJet JavaScript API.

Jetrack