Quickstart for Web

Get up-and-running with Localize for Web

Getting started with Localize for Web is simple and shouldn't take more than a few minutes. If you haven't already, first follow the instructions for Signing Up and creating your first Website / Web App project.

Integration Instructions

Step 1: Install the Code Snippet

Copy and paste the following code snippet in the <head> tag in your website, in all pages that you want to Localize.

<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"],t=0;t<e.length;t++)a.Localize[e[t]]=function(){}}}(window);</script>

<script>
  Localize.initialize({
    key: '[[app:key]]', 
    rememberLanguage: true,
    // other options go here, separated by commas
  });
</script>

Alternatively, check if your website uses one of the technologies for which we have an integration guide.

Step 2: Verify successful installation

After installing the code snippet, refresh your website/application.

  • If you see the Localize widget at the bottom of your site, Localize is successfully installed.
  • Localize will automatically begin to detect new content on the pages that you visit, and will bring it into your dashboard.

Step 3: Check for Phrases in the Dashboard

Then check your Phrases tab to review your content.


Watch this short video to learn how to get started.

What's Next?


Troubleshooting

Widget not present

  • Does the code copied into your site contain "YOUR-PROJECT-KEY" or "[[app:key]]" next to the "key: " line in the code snippet? If so, replace "YOUR-PROJECT-KEY" or "[[app:key]]" with your unique Project Key found on the Project Overview page.

  • If you are not using the widget, another way to verify installation is to enter the following into the browser's developer console:

    • Localize.v - if you don't get an error and you see a number, then Localize is installed and running.

Source Language Seen Before Target Language

Ensure the code snippet is placed in the <head> tag and not the <body> tag. Placing the Localize code in the <body> of your site will have a negative impact on performance, and may cause other problems like your source language flashing on the screen before the target language is displayed.

Contact Support

If you're still having trouble, contact us for assistance!


Did this page help you?