Link to the plugin page: https://zeroqode.com/plugin/1571975602083x915914147754672100
Demo to preview the plugin:
Introduction
Want to gather useful information about the users visiting your Bubble app, such as their browser and device? This no-code plugin offers a variety of tools to assist you with that.
It utilizes various native JavaScript functions, methods, and open-source resources to retrieve information about the client.
With this plugin, you can easily create a client object to extract valuable details about the devices connecting to your site and product. By utilizing the plugin’s events, you can ask specific questions like “Does the user have an iOS or Android device?” or even more specifically, “Is the user’s device an iPad?” ClientJS also enables you to generate browser/device fingerprint IDs.
How to setup
- Add the User Info Element.
Add the User Info element to the page in your Bubble app where you want to retrieve or monitor user information.
This element is the core of the plugin and allows you to fetch and provide details about the user's environment.
- Configure Events.
- A User Info LocalStorage Not Available
- A User Info SessionStorage Not Available
- User Info Cookies Are Not Available
- A User Info Is Mobile
- A User Info Is Android
- A User Info Is IOS
- A User Info Flash Is Not Available
- A User Info Is Mac
- A User Info Is Windows
- A User Info Is Ubuntu
- A User Info Is Linux
- A User Info Is Internet Explorer
- A User Info Is Safari
- A User Info Is Chrome
- A User Info Is Firefox
The plugin offers multiple events that allow dynamic reactions based on the user's environment. Below is the full list of available events:
Triggered when the browser does not support LocalStorage.
Triggered when SessionStorage is not supported.
Triggered if cookies are disabled or unavailable.
Triggered when the user is accessing the page on a mobile device.
Triggered when the user is on an Android device.
Triggered when the user is on an iOS device.
Triggered if Flash is not supported by the user's browser.
Triggered when the user is using a Mac operating system.
Triggered when the user is using a Windows operating system.
Triggered when the user is using Ubuntu.
Triggered when the user is using any Linux-based operating system.
Triggered when the user is using Internet Explorer.
Triggered when the user is using Safari.
Triggered when the user is using Chrome.
Triggered when the user is using Firefox.
- Configure Actions.
- Read User Data A User Info
This action retrieves detailed information about the user's environment when triggered.
Plugin Element Properties
User Info
Fields:
Title | Description | Type |
Get data | Get user data instantly or run it from workflow Available options: Auto, Workflow | Dropdown |
Element Actions
- Read User Data - This action retrieves comprehensive user data about their browser, device, and environment, making it accessible for workflows. It can be used to tailor user experiences or gather diagnostic information.
Exposed states
Title | Description | Type |
Browser Name | The name of the browser used by the user (e.g., Chrome, Firefox, Safari). | Text |
Browser version | The version of the browser used by the user. | Text |
Browser major version | The major version of the browser used by the user. | Text |
Device model | The model of the device the user is using (e.g., iPhone 13, Galaxy S21). | Text |
Device type | The type of device the user is using (e.g., mobile, desktop, tablet). | Text |
Device vendor | The manufacturer or vendor of the device (e.g., Apple, Samsung). | Text |
Engine name | The name of the rendering engine used by the browser (e.g., Blink, Gecko). | Text |
Engine version | The version of the rendering engine used by the browser. | Text |
OS name | The name of the operating system (e.g., Windows, macOS, Linux). | Text |
OS version | The version of the operating system. | Text |
Color Depth | The color depth of the screen in bits (e.g., 24-bit, 32-bit). | Number |
Current Resolution | The current screen resolution being used by the device. | Text |
Available Resolution | The maximum available resolution for the device screen. | Text |
Device XDPI | The horizontal DPI (dots per inch) of the device screen. | Text |
Device YDPI | The vertical DPI (dots per inch) of the device screen. | Text |
Browser Plugins | A list of plugins installed in the user's browser. | Text |
Mime Types | A list of supported MIME types in the user's browser | Text |
Fonts Available | A list of fonts available on the user's system. | Text |
Time Zone | The time zone setting of the user's device. | Text |
Language | The language preference set in the user's browser. | Text |
System Language | The system language of the user's device. | Text |
LocalStorage is available | Indicates whether LocalStorage is available on the user's browser. | Checkbox (yes/no) |
SessionStorage is available | Indicates whether SessionStorage is available on the user's browser. | Checkbox (yes/no) |
Cookies are available | Indicates whether cookies are enabled in the user's browser. | Checkbox (yes/no) |
Is Mobile | Indicates whether the user is accessing the app on a mobile device. | Checkbox (yes/no) |
Is Android | Indicates whether the user is accessing the app on an Android device. | Checkbox (yes/no) |
Is iPhone | Indicates whether the user is accessing the app on an iPhone. | Checkbox (yes/no) |
Is IOS | Indicates whether the user is accessing the app on an iOS device. | Checkbox (yes/no) |
Is iPad | Indicates whether the user is accessing the app on an iPad. | Checkbox (yes/no) |
Is Flash Available | Indicates whether Flash is available on the user's browser. | Checkbox (yes/no) |
Fingerprint | A unique identifier generated based on the user's browser and device information. | Number |
Is Mac | Indicates whether the user is using a Mac operating system. | Checkbox (yes/no) |
Is Windows | Indicates whether the user is using a Windows operating system. | Checkbox (yes/no) |
Is Ubuntu | Indicates whether the user is using Ubuntu. | Checkbox (yes/no) |
Is Linux | Indicates whether the user is using a Linux-based operating system. | Checkbox (yes/no) |
Is Internet Explorer | Indicates whether the user is using Internet Explorer. | Checkbox (yes/no) |
Is Safari | Indicates whether the user is using Safari. | Checkbox (yes/no) |
Is Chrome | Indicates whether the user is using Chrome. | Checkbox (yes/no) |
Is Firefox | Indicates whether the user is using Firefox. | Checkbox (yes/no) |
Resolution Width | The width of the user's screen resolution in pixels. | Number |
Resolution Height | The height of the user's screen resolution in pixels. | Number |
Element Events
Title | Description |
LocalStorage Not available | Triggered when LocalStorage is unavailable in the user's browser. |
SessionStorage Not available | Triggered when SessionStorage is unavailable in the user's browser. |
Cookies are Not available | Triggered when cookies are disabled or unavailable in the user's browser. |
Is Mobile | Triggered when the user is accessing the app on a mobile device. |
Is Android | Triggered when the user is using an Android device. |
Is iOS | Triggered when the user is using an iOS device. |
Flash is Not available | Triggered when Flash is unavailable in the user's browser. |
Is Mac | Triggered when the user is using a Mac operating system. |
Is Windows | Triggered when the user is using a Windows operating system. |
Is Ubuntu | Triggered when the user is using Ubuntu. |
Is Linux | Triggered when the user is using a Linux-based operating system. |
Is Internet Explorer | Triggered when the user is using Internet Explorer. |
Is Safari | Triggered when the user is using Safari. |
Is Chrome | Triggered when the user is using Chrome. |
Is Firefox | Triggered when the user is using Firefox. |
