For Bubble users looking to redirect their app’s URL from the default Bubble domain to a custom whitelabeled domain, the following script can be easily added to your Bubble application. This script ensures that users accessing your app via the Bubble subdomain are redirected to your custom domain, unless a specific debug mode parameter is present in the URL.
How the Script Works
-
Script Initialization: The script is executed when the document is fully loaded using the jQuery document.ready function.
-
Identify Current URL: The script checks the current URL of the page.
-
Host Check: It verifies if the current host contains .bubbleapps.io, which indicates that the user is accessing the app via the default Bubble domain.
-
Debug Mode Check: It checks if the URL contains the query parameter debug_mode=true. If this parameter is present, no redirection occurs, allowing developers to debug the app without redirection.
-
Redirection: If the current host contains .bubbleapps.io and debug_mode=true is not present, the script redirects the user to the custom whitelabeled domain.
Adding the Script to Your Bubble App
To add this script to your Bubble application, follow these steps:
- Open Settings: Navigate to the Bubble editor and open the “Settings” tab.
- SEO/Metatags: Select the “SEO/metatags” tab from the settings menu.
- Script/meta tags in header or Script in the body: Add the script to the “Script/meta tags in header” field or the “Script in the body” field. Either location works, but placing it in the header ensures it runs as soon as possible.
- Set the Whitelabeled Domain: Ensure that the data-whitelabeled-host attribute in the script is set to your whitelabeled domain (e.g., mydomain.com).