Hubspot’s Website Multi-Language Feature in Action

Last year, we helped a well-established international document management company—DocuWare—make the move to HubSpot’s website platform. They were previously using Drupal, an open source CMS, and had web pages in German, French, Spanish, and English. Although DocuWare had been using HubSpot’s Marketing Hub, blog, and landing pages for a couple years, the time had come to refresh, simplify and streamline the rest of the marketing operation.

Part of this decision to move the rest of the website to HubSpot’s COS was because of its capabilities for multi-language websites. The platform makes it easy to create and manage translated pages in a SEO-friendly way. We found that this was the case, but not without some lessons learned along the way. So we thought we’d share these lessons with you! Here’s a peek into our journey.

Setting up multi-language pages in HubSpot

Setting this up in HubSpot is simple, in a nutshell, you…

1. Go into your landing or website pages and click More > Create Translation.

Hubspot’s Website Multi-Language Feature in Action

2. Select whether you are creating a new translation for your master page, or if the page you selected needs to be connected to its master page.

Hubspot’s Website Multi-Language Feature in Action

3. Depending on your selection, you’ll either choose the language of the translated clone (as shown above), or, if you’re choosing a master, you’ll select the master page that your translation should be connected to.

Hubspot’s Website Multi-Language Feature in Action

4. Once the page is connected, you’ll see the globe icon next to the page, and you’ll be able to toggle between the different languages to edit and view the performance of each translated version.

5. Once the pages are live, you can allow your visitors to choose which language they want to view the page in by adding a HubSpot Language Switcher Module to the template and customize the look.

Hubspot’s Website Multi-Language Feature in Action

6. If you want your website to automatically redirect a visitor to the pages in their language based on their location, you can take it a step further and set this up with a combination of Hubl and Javascript. 

We added a banner at the top of the screen so that visitors have a choice to choose their language. This allows whatever language they choose—whether it’s automated or by their active selection—to be cookied and applied on any subsequent visit.

Hubspot’s Website Multi-Language Feature in Action

And that’s it! Well, not really. Getting to that step requires thorough planning and preparation to avoid issues down the road. Here are a few things to consider before diving in.

Creating templates

  • You’ll need a cloned template of the master language for each language variation. This is so translated versions of global modules like navigation and footers can be easily managed without affecting the other languages.
  • Keep your templates organized in separate folders for easy management. Cloning templates can quickly get out of hand.
  • Hubspot’s Website Multi-Language Feature in Action

    • Once the translated text is applied to the template, the variation in text length may throw off your margins. This may mean going back in to make adjustments to the template once the copy has been added.
  • Also worth noting that, on custom modules in templates, you can localize minor strings of text inside by sniffing for the URL of the localization. For example, DocuWare used this code on one page: 

    Hubspot’s Website Multi-Language Feature in Action

    The ins and outs of SEO when using this feature

    HubSpot’s translation feature uses a Google recommended SEO structure for multi-language sites—subdirectories.

    This structure puts the content of every language in a different subdirectory while consolidating domain authority.

    Hubspot’s Website Multi-Language Feature in Action

    The benefit of this process is that the variant page will take advantage of the ranking power of the master page (in this case, the English page).

    According to Google, this setup is easier to arrange and handle when updating or maintaining a site (also, Apple uses it). And if you’re interested in only serving one of your language sites to a specific area, and not to everyone that can speak the language all over the world, this URL structure also makes it easy to segment parts of the website for geotargeting.

    And a few things we learned the hard way…

    • If you bring a published page and its translations to Content Staging for editing, HubSpot will automatically archive the translated attachments.
    • Note that the page URLs don’t cleanly display special characters like the Spanish ñ. To avoid rendering messy and long URLs with lots of numbers and % signs, opt to use simple, safe characters like a-z, A-Z, and 0-9.
    • As far as tracking and analytics goes, you’ll have to set up filters in Google Analytics for each language—that ability is not yet available in HubSpot.

    The site and its translations have been live for months now and remain easy for DocuWare’s team to manage on their own. If you’re looking to do something similar and have questions (we don’t blame you), feel free to reach out!

    Hubspot’s Website Multi-Language Feature in Action

    Author: Brandon

    Hello! My name is Brandon and I am a business coach, here on the pages of this site I want to share with you by my many years work experience. I hope that my experience will one day be useful to you! And if the life of at least one reader of my site been better, I will been happy and will know that I'm doing it for good reason!