Transifex

Lede: Connect Transifex with Webflow to translate your site into multiple languages and publish translation updates over the air.

Publishing a site in one language is straightforward. Reaching audiences in French or Japanese means coordinating translators, reviewers, translation memory, and terminology across every page. Those workflows belong in a translation management system like Transifex.

Connecting Transifex with Webflow puts that translation layer on top of your published site. The Transifex Live JavaScript snippet detects your content, lets translators edit it in context on the live page, and serves translations to visitors as they load. Because delivery runs through the snippet, translation edits reach visitors without a Webflow republish. For CMS-heavy projects, the Transifex and Webflow Data API support a full round-trip sync into localized CMS items.

The snippet path suits nontechnical site owners and marketing teams who want translated pages without writing code. Localization managers get centralized translation memory and glossaries, plus review workflows. Agencies delivering multilingual client sites and developers building automated sync pipelines can work through Zapier or the APIs.

How to integrate Transifex with Webflow

What is Transifex? Transifex is a localization platform and translation management system for websites, mobile apps, software interfaces, documentation, and marketing materials. It supports 700+ languages and file formats including JSON, PO, XML, and YAML. Core features include translation memory, glossaries and style guides, machine translation through services like Google Translate and DeepL, and Transifex Live for JavaScript-based website localization.

Teams pair Transifex with Webflow when a site needs to serve multiple languages and translation work involves more than machine output. Transifex Live lets translators edit copy directly on the live page and ship updates instantly, while the platform handles review steps and terminology consistency behind the scenes. Because Transifex connects outside the Webflow Marketplace, the connection runs through custom code and automation paths through Zapier or the APIs.

The Transifex-Webflow integration supports three approaches:

• The Transifex Live snippet translates your published site through a JavaScript embed, with in-context editing and no code beyond a copy-paste.
• Zapier connects Webflow events to Transifex localization workflows without custom development.
• The Webflow and Transifex APIs give you full control over CMS content sync, but require server-side development.

Implementations can combine two or more of these methods depending on the complexity of the setup.

Add the Transifex Live snippet to your site's head code

Transifex Live connects to Webflow through a JavaScript snippet pasted into your site's custom code in the head and body tags. Transifex describes this as the way to localize a Webflow website without writing code, and it targets designers, marketers, and SMB owners. Developer-led work can use Zapier or the APIs. Adding custom code requires a Webflow plan that includes custom code access.

To set up the integration:

1. Create a Live resource in your Transifex project to generate the JavaScript snippet, then copy it.
2. In Webflow, go to Site settings > Custom code and paste the snippet into the Head code section.
3. Click Save changes and publish your site to activate Transifex Live.
4. Open your live site through Transifex and start adding translations.

Once the snippet is running, Transifex Live gives you several capabilities:

• Translators edit copy in context directly on the live page.
• The library detects page content automatically as each page loads.
• Visitors get a language picker by default.
• Over-the-air publishing sends translation updates live without republishing the site.

Code in the Head code section loads before the closing </head> tag and applies to your entire site, which is exactly where Transifex instructs the snippet to go. Each custom code section holds up to 50,000 characters. If the snippet cannot sit in the head tag, set the manual_init parameter to true and call Transifex.live.init() when ready.

Translate Webflow CMS content

The snippet handles static pages out of the box. Content rendered by the Webflow CMS needs extra configuration. Transifex states that "By default, Transifex Live automatically handles static content, i.e., HTML initially loaded from the first HTTP request." Content injected on Collection pages or through a Collection List falls outside that default.

To translate CMS-driven content, instruct the Transifex JavaScript library to monitor the page for dynamically injected content, which Transifex recommends as the standard approach. For more complex scenarios, use the Transifex JavaScript API to control detection and rendering directly. Without one of these steps, Collection-based content such as blog posts and product listings stays untranslated.

Publish translations to your live site

Translations do not appear to visitors until you publish them from Transifex, and publishing happens entirely on the Transifex side. The publishing workflow separates production and staging targets, so you can review a language before it reaches visitors.

To publish translations:

1. Click Publish in the Transifex Live sidebar.
2. Choose the production site or staging site tab.
3. Select which languages to take live and, for each, choose all translations or only reviewed ones.
4. Hit Publish to production or Publish to staging.

Translations then serve over the air, so you never republish the Webflow site to ship a translation update.

Connect Webflow and Transifex with Zapier

Zapier is the only automation platform with connectors for both sides and a direct Transifex + Webflow integration page. Transifex documents Zapier in its own help center, and its automation documentation is Zapier-centered. This path suits teams that want translation events to drive notifications or downstream workflows without writing code.

On the Transifex side, triggers include events such as "Localization Activity Completed in Transifex" and "Task for a Set of Strings in Transifex." On the Webflow side, Zapier exposes triggers such as new form submissions, new comments, new and updated orders, and resolved comment threads. Map any of these triggers to actions in the other app to automate handoffs between translation work and site events.

Build with the Webflow and Transifex APIs

For CMS-driven sites where search visibility matters, an API round-trip stores translations directly in localized CMS items. The snippet path serves translations through JavaScript. The API path gives you server-rendered translated pages with per-locale publishing control, plus event-driven automation. It requires server-side development. Both APIs authenticate with an Authorization: Bearer <token> header.

The Transifex API v3 at https://rest.api.transifex.com handles projects, resources, source strings, and translation downloads. The Webflow Data API v2 handles localized CMS items, locale discovery, and publishing. Webflow webhooks and Transifex webhooks trigger real-time events between the two systems. Together these cover the full loop, from detecting new Webflow content to publishing translated CMS items.

Send Webflow CMS content to Transifex

The outbound half of the sync extracts primary-locale content and uploads it as Transifex source strings. Both upload endpoints on the Transifex side are asynchronous, so your integration polls a job URL for completion.

To implement the outbound sync:

1. Call GET /v2/sites/{site_id} to retrieve the localeId and cmsLocaleId values for every configured locale.
2. List primary-locale content with GET /v2/collections/{collection_id}/items; omit cmsLocaleId to get the primary locale. Paginate with offset and limit.
3. Create a Transifex resource with POST /resources, then upload strings with POST /resource_strings_async_uploads. The API returns 202 Accepted with a Content-Location header to poll until the job completes.

To make this event-driven, register collection_item_created and collection_item_changed webhooks via POST /v2/sites/{site_id}/webhooks. Verify requests using the x-webflow-signature header with SHA-256 HMAC.

Push completed translations back to Webflow

The inbound half listens for translation completion, downloads the translated strings, and writes them into localized CMS items. Transifex fires a translation_completed webhook when a target language reaches 100% translated.

To implement the return path:

1. Subscribe to the translation_completed Transifex webhook event and verify the X-TX-Signature-V2 header, which uses a shared secret with HMAC-SHA256.
2. Download translations with POST /resource_translations_async_downloads and poll the Content-Location URL until the job finishes.
3. Update localized items with PATCH /v2/collections/{collection_id}/items. Include the cmsLocaleId for each item, up to 100 items per request.
4. Publish the staged items with POST /v2/collections/{collection_id}/items/publish, or trigger a full republish with POST /v2/sites/{site_id}/publish.

You cannot add a new locale to an existing CMS item through the API, so add secondary locales in Webflow first, and remember that each locale keeps an independent publishing state.

What you can build with the Transifex Webflow integration

Teams can use the Transifex and Webflow integration to run a multilingual site from one translation workflow, without maintaining duplicate pages for every language. These patterns show what the setup supports.

• Global marketing sites: Translate landing pages and homepages in context, then ship updates over the air. A SaaS team can serve German and Japanese versions of the same Webflow site while translators edit copy directly on live pages.
• Multilingual documentation portals: Localize help content stored in CMS Collections, with translation memory reusing repeated strings across articles so recurring UI terms translate once.
• International e-commerce catalogs: Localize product descriptions and category pages stored in CMS Collections, so shoppers browse in their own language across each market.
• Multi-region campaign microsites: Launch a campaign site in several markets at once. Transifex review workflows approve each language before you hit Publish to production.

If you need more control over SEO for translated pages and CMS-driven content, the API integration path covers those cases with full flexibility. Explore the Webflow CMS API to see the full round-trip in practice.