Translate HubSpot Landing Pages

Below are step-by-step guides for integrating Localize on individual Landing Pages in your Hubspot solution.

If you do not have a Localize Project yet, signup here!

Individual Landing Page

Follow the instructions below to integrate Localize in a specific Landing Page.

📘

Using both Website Pages + Landing Pages

If you are using both the Website Pages and Blog features in Hubspot (and using the same Theme for both) the settings in your Website Pages will also be applied to your Blog. So there's no need to follow the separate instructions for integrating your Blog.

1. Navigate to your Landing Pages

From your HubSpot Marketing Dashboard, select the Marketing dropdown, then Website, then Landing Pages.

2. Select "Edit"

Then click Edit next to the your landing page's name.

3. Select "Advanced Options"

Click Settings then scroll down and then click the Advanced Options dropdown.

4a. Add the Localize Code Snippet

Add the snippet to Head HTML and then click Save in the upper right hand corner.

<script src="https://global.localizecdn.com/localize.js"></script>
<script>!function(a){if(!a.Localize){a.Localize={};for(var e=["translate","untranslate","phrase","initialize","translatePage","setLanguage","getLanguage","detectLanguage","getAvailableLanguages","untranslatePage","bootstrap","prefetch","on","off","hideWidget","showWidget","getSourceLanguage"],t=0;t<e.length;t++)a.Localize[e[t]]=function(){}}}(window);</script>

<script>
  Localize.initialize({
    key: '[[app:key]]', 
    rememberLanguage: true,
    blockedClasses: ["contentEditor-sidebar", "private-template__section", "isc-help-widget", "private-layer"],
    // other options go here, separated by commas
  });
</script>

4b. Add Initialization Options

Add any desired options to the Localize.initialize() call above, check here for the full list of possible options.

Some popular options include:

• autoApprove - use to fully automate your translation workflow
• localizeImages - allows for localization of images in your site

5. View and reload your Landing Page.

1. Visit your Landing Page in a browser.
2. Select one of your target languages using the language-switching widget.
3. Refresh the page.
4. Lather, rinse, repeat, for each page on your site.

Localize will automatically begin to detect new content on the pages that you visit, and will bring it into your dashboard.

6. Approve phrases

Then head on over to the Manage Phrases page to approve phrases in the Localize dashboard.

7. Phrases not showing up?

If you are not seeing phrases show up in your Pending bin in the Localize dashboard, follow the troubleshooting instructions here.

Need Help? Contact us for custom integration help or troubleshooting!