Bubble integration

Learn how to connect your Bubble application to Atlas as an internal dashboard.

Overview

Atlas allows you to integrate custom applications as internal dashboards. This guide will walk you through the process of connecting a Bubble application to serve as an internal dashboard within Atlas.

Creating your Bubble application

First, design and build your Bubble application to display the information you want your team to access. Ensure your application can accept and utilize parameters such as user ID, user email, and username.

Publishing your Bubble application

Once your Bubble application is ready, publish it within Bubble. After publishing, copy the URL of your published application. You'll need this URL for the next step.

Connecting to Atlas

To integrate your Bubble application with Atlas, go to App Configuration > Internal Dashboard section. Paste your Bubble application's URL in the provided field.

Add necessary parameters using Atlas placeholders, such as user_id={{user_id}}, user_email={{user_email}}, and username={{user_name}}. Remember to save your settings after making these changes.

Adjusting Bubble security settings

If you encounter a "Content Security Policy Frame Ancestors" error, you need to adjust your Bubble application's settings. In Bubble, navigate to Settings, then to the General tab. Find the "Allow iFrame embedding" option and enable it. Don't forget to save your changes in Bubble.

Testing the integration

To test your integration, open the Atlas inbox and select a user profile. Look for the Internal Dashboard option and click to open it. Verify that your Bubble application loads correctly with the user's information displayed.

Using cookies for authentication

If your Bubble application requires authentication, you can utilize cookies. Atlas shares a cookie containing the user ID, which your application can use for authentication purposes. This allows seamless access to your dashboard within Atlas without requiring additional login steps.

Troubleshooting

If your Bubble application doesn't appear or load correctly in Atlas, verify that the URL is correct and all necessary parameters are included in the Atlas settings. Confirm that iFrame embedding is allowed in your Bubble settings. Also, check for any console errors that might provide additional information about the issue.