Bubble - Integration / Setup

Translate your Bubble website

Translate all your content and make your Bubble website multilingual within minutes.

1) Create an account on Weglot

This account will be where you manage and edit all your translations. You can create your Weglot account here.

javascript-translate

You should receive a validation email in the account with which you signed up.

Then select “other” as your website technology.

javascript-select

2) Add your new languages

Once you’ve set up an account, add your domain name, and select the original language of your site and the language you want to translate your site into.

choose-javascript

NOTE: If you’re using a temporary bubble domain name (for example: app.bubble.io) you should use the “Javascript integration” instead. Once you have a permanent domain you can continue with this integration, which will give you language subdomains.

Click on the “Next” button.

3) Configure the subdomains in the DNS records

This next step is where you’ll configure your DNS records to create and connect the subdomains. These subdomains will display the translations of your Bubble website once configured.

For this example we’re using GoDaddy as our domain name provider –  but the process is similar no matter which domain name provider you’ve purchased your domain from(e.g: Google Domains, NameCheap, Dreamhost etc.). If you need any help setting up your DNS records, feel free to contact us at support@weglot.com.

On your Weglot account setup, you’ll see the following DNS entries to add (note: this example is for setting up French):

Now, go to your domain name provider account and to the section or page where you can manage the DNS and add the entries shown on your Weglot dashboard (for instance, in GoDaddy, it looks like this).

godaddy-dns-weglot

Save the entries, go back to your Weglot dashboard, and click on the ‘Check DNS’ button. This process can take up to 10 minutes so don’t worry if the green tick doesn’t appear immediately on your Weglot setup dashboard. Once that’s done, you’ll be able to proceed to the next step.

4) Add the Javascript code

This will allow you to add a language-switcher button to your Bubble website.

  • Go on your Bubble website, click on “Settings” > “SEO / metatags” 
  • Go to “Advanced Settings”, and you should see a field that’s titled “Script/meta tags in header”
add javascript bubble
  • Copy and paste the JavaScript snippet provided to you on your Weglot account. It will look like the following one.

Click on the green button, “Save Changes” and publish your changes by clicking on the blue button at the very top right.

5) Your Bubble website is now multilingual!

Once it’s done, you’ll be able to see the language switcher button at the bottom of your website. Feel free to test it and switch between languages. Weglot will automatically generate a first layer of automatic translation. You’ll then be able to edit and manage your translation from your Weglot dashboard. 🙂

Still need help? Contact Us Contact Us