logo
Zeroqode Docs
/
Plugins

Google Analytics with Webhooks Plugin

✅
Link to plugin page: https://zeroqode.com/plugin/complete-google-analytics-with-webhooks-1528977756665x631973219328327700

Demo to preview the plugin:

✅
Live Demo: https://zeroqode-demo-15.bubbleapps.io/google_analytics_with_web
✅
Bubble Editor: https://bubble.io/page?type=page&name=google_analytics_with_web&id=zeroqode-demo-15&tab=tabs-1&version=live
☝
Note: This plugin will work only when Bubble's "Google Analytics" plugin is also installed and the GA tracking code is entered
☝
Note: This plugin (due to used library restrictions) works only with web applications, and due to that, can't be used to monitor native applications (for example a Bubble application converted through Air Native service).
Image without caption

Google Analytics With Webhooks - Quick Setup Guide

Example POST GA Object:
javascript
{
    "pbAnalytics": {
        "results": [
            {
                ":name": "***",
                ":trackingId": "***",
                ":cookieDomain": "***",
                ":apiVersion": "***",
                ":clientVersion": "***",
                ":referrer": "***",
                ":location": "***",
                ":screenResolution": "***",
                ":screenColors": "***",
                ":viewportSize": "***",
                ":flashVersion": "***",
                ":encoding": "***",
                ":javaEnabled": "***",
                ":language": "***",
                ":_gclid": "***",
                ":_gclsrc": "***",
                ":_gt": "***",
                ":_gcn": "***",
                ":storedClientId": "***",
                ":clientId": "***",
                ":_gid": "***",
                ":adSenseId": "***"
            }
        ],
        "Event": {
            "Category": "***",
            "Action": "***",
            "Label": "***"
        }
    }
}

First you need to setup your API Endpoint.

  1. In your app, go to the settings tab, then the API tab, Check the "This app exposes a Workflow API".
  1. Now drop down the menu in the top left of the editor (next to the bubble symbol) & click API Workflows.
  1. Create a new API Endpoint & name it 'analytics' without the quotes.
  1. Replicate the setup you see in the below image.​
Image without caption
5. Navigate back to a page, place a button down and setup the "Analytics Action" "Setup Endpoint".
  1. Preview your app so that you have another window open & in the editor go back to the API Workflow and click Detect Data.
  1. Now click the button in the other window and your endpoint will be setup to receive the full GA Data Objects from the plugin.
  1. Remember to setup an action to create a new thing if thats your intended us or use the other Analytics Actions to create events

To have many Input, Div & Button Clicks AutoTracked - Use place the Auto Analytics Element on your page.

Image without caption

There is also a Campaign Builder Element, this will format your custom URL's and parameters for your campaign.

Drop the element on your page then use the Element Action "Get Campaign URL".
Image without caption

Result: (link show formatting - not a real app)

​https://myapp.bubbleapps.io/?utm_source=myCampaign&utm_medium=cpc&utm_campaign=spring_sale&utm_term=bubble%20plugins%20discounts&utm_content=my_spring_sale​
Added 'Redirect URL for login' state and 'Redirect URL for login is ready' event for better authentication flow
Image without caption

Changelogs

Gmail - Small Business Plugin for Bubble
Google Calendar Service Account Plugin
Powered by Notaku
Share
Content
Google Analytics with Webhooks Plugin
Demo to preview the plugin:
Google Analytics With Webhooks - Quick Setup Guide
First you need to setup your API Endpoint.
To have many Input, Div & Button Clicks AutoTracked - Use place the Auto Analytics Element on your page.
There is also a Campaign Builder Element, this will format your custom URL's and parameters for your campaign.
Result: (link show formatting - not a real app)
Changelogs