Translate Framer Sites

This Framer integration guide shows you how to translate Framer websites in a few easy steps.

Want to translate your Framer website? It’s easy with Localize!

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

Follow these steps to get started.

1. Open your Framer Dashboard

  1. Open your Framer Project and Navigate to your project's settings by clicking the settings icon on the top right corner of your screen.
  2. Select the General item in the left navigation bar.
  3. Scroll down to the Custom Code section.
1097

2a. Add the Localize Code Snippet

  1. Copy the following Localize Code Snippet into the End of <head> tag section.
<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,
    // other options go here, separated by commas
  });
</script>

2b. Add Initialization Options (optional)

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

3. Save & Publish

  1. Click Save to save your changes, then click Publish to publish the changes to your website/ project.

4. Reload your website.

  1. Visit your website 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.

5. Approve phrases

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

6. Phrases not showing up?

If you are not seeing phrases show up in your Pending bin in the Localize dashboard; try toggling the Localize widget to a different language and then refresh again or follow the troubleshooting instructions here.


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