Follow Sheila Villalobos on:  

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.

Create Translation

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.

Page Translation Setting

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.

Page Translation Settings Continued

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.

Request a Demo Example

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.

Would you like to translate this page?

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.

Template Folders

  • 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: 

    Code

The ins and outs of SEO when using this feature

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

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

Example of URLs

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!

Free Download: Website Redesign vs. Refresh – Sizing Up Your Digital Makeover with 12 Decision Factors

About the Author

Sheila Villalobos | Account Manager
pmg
Sheila Villalobos, Account Manager

Sheila Villalobos is a PMG Account Manager and trend tracking extraordinaire. When she’s not being her naturally resourceful self and figuring out new ways to use old marketing tools, you can find her staying up to date on all things web design, ABM, contextual marketing and strategy (and writing blogs about them).

 Tags: Customer Stories HubSpot

Subscribe to Our Blog!

New Call-to-action

Have any thoughts on this blog post topic? Let us know!

Simply post a comment below to add to the conversation.