COS-General

How can I manage multi-language content with HubSpot?

Last updated: May 24, 2018

Available For:

Marketing: Basic, Pro, Enterprise
Sales: N/A
Service: N/A

As your company expands globally and you create pages in multiple languages, you need an easy way to create and manage all of your content for each market.

Here you'll learn how to select your domain's primary language, create a translated page, and add a language switcher button to your live pages so visitors can easily access the translated versions.

Please note: currently these features are only available for website and landing pages.

Choose your primary language (per domain)

Before you create any translated pages, you'll need to set the primary language for each domain you have set up in HubSpot. To do this:

  • In your HubSpot account, click the settings icon settings in the main navigation bar.
  • Select MarketingDomains & URLs on the left-hand side, then click the Language Settings tab.
  • Click Choose primary language next to the domain you'd like to build your translated pages on.
  • In the dialog box that appears, select a language from the dropdown, then click Save.

Note: if you inadvertently set your primary language incorrectly, please contact Support. It can take up to 3 business days to reset the primary language setting.

Create a translated website or landing page in HubSpot

  • In your HubSpot Marketing account, navigate to Content > Website Pages or Landing Pages.
  • Hover over an existing landing or website page to reveal the action buttons and select More Create Translation.

  • Select a primary language for your domain.
  • On the Create new translation tab, choose the language of your current page from the dropdown menu and select a language for your translated clone.
  • Click Create.

  • A variation will be created and the language abbreviation will be appended to the Page URL under Settings.
  • You can now access the master page and any other translated pages using the language dropdown menu that appears at the top-left.

Note: none of the actual content on the page will be translated; you will need to do this on your own. If you've specified a language that reads right-to-left such as Arabic or Hebrew, the content editor on your translated page will update to reflect this formatting.
  • A globe icon will be appear next to the website pages and/or landing pages dashboard to indicate a translated page. You can hover your mouse over the icon to see a list of the translations:

  • The page's language will be defined in the html head based on the domain's defined language setting; if no language was set, the COS will default to defining the domain as English):
<meta http-equiv="content-language" content="fr">
  • Incorporating 'hreflang' tags for COS-hosted Website and Landing Pages:
<link rel="alternate" hreflang="fr">
<link rel="alternate" hreflang="en">
<link rel="alternate" hreflang="de">

HubSpot will automatically rewrite links on translated pages if we detect that the linked page has a translated version. You can disable this feature for a particular HTML element and its children by adding "hs-skip-lang-url-rewrite" to the class list for that element. You can learn more about applying a custom class to a specific module group in this article.

Connect a translated page to a master page

If you have a master page using your default language that is already out there in the world and doing well in the search rankings, you can connect a translated page to that page that will have the same rankings as the master.

To connect an existing translated page to a master page:

  • In your HubSpot Marketing account, navigate to Content > Website Pages or Landing Pages.
  • Hover over an existing page to reveal the action icons and click More Create Translation

  • On the Choose a master tab, select the language of your current page from the dropdown menu and select a master page with which to associate this translation.
  • Click Save.

Add a Language Switcher module to your page template

You can now add a button to your page that will allow users to switch between translated versions of your page.

Please note: this button will only appear on live pages if you have published and connected more than one translated version of the page.

To do so:

  • Navigate to your page's template.
  • In the inspector on the right-hand side, click + Add and use the search to look up a Language Switcher module.
  • Click and drag the Language Switcher module into place on your template, then click on the module to select it in the inspector.
  • Select the display mode for your language switcher:
    • Localized means that the name of each language will appear in that language. For example, if you're viewing the English version of a page with a French translation, when you click the language switcher, you'll see English and Français as the language names.
    • Pagelang means that the names of the languages will appear in the language of the current page. For example, if you're viewing the English version of a page with a French translation, when you click the language switcher, you'll see English and French as the language names. 
    • Hybrid is a combination of the two. For example, if you're viewing the English version of a page with a French translation, when you click the language switcher, you'll see English and French (Français) as the language names.

While you can create a translated page in any of the languages available in the Select a language for your translated clone dropdown menu (see above) and the language name will appear in the switcher, only the following language names will appear translated in that language when rendered in the language switcher:

  • Chinese (China)
  • Chinese (Hong Kong)
  • Czech
  • Danish (Denmark)
  • Dutch (Netherlands)
  • Finnish (Finland)
  • German (Germany)
  • Greek (Greece)
  • Italian (Italy)
  • Japanese (Japan)
  • Norwegian Nynorsk (Norway)
  • Polish (Poland)
  • Portuguese (Brazil)
  • Spanish (Mexico)
  • Spanish (Spain)
  • Swedish (Sweden)
  • French (France)
  • Click Done
  • Click Publish in the upper-right hand corner to publish your changes to your template.

Change the default primary language for your translated page

If you would like to change the default primary language for a translated page, you can do so within the landing page dashboard. 

  • Click the globe icon next to the name of your translated page to view a list of existing translations. The master language will be first in your list of translations. 
  • Click the trash can icon next to the master translation to open up a dialog box that will prompt you to select a new master version of the page. Select the master page you would like to choose and click Set new master.
  • After specifying the new master page, you can click Cancel or click anywhere outside of the dialog box to keep the old master version of the page as a translation. 

Was this article helpful?