Simplifying FSFE translation process: integrating LibreTranslate
A new release of the Webpreview tool is here! This is our in-house Free Software preview tool for FSFE webpages. It supports our amazing volunteers in translating, and checking website content. Our latest update integrates LibreTranslate, providing a helpful starting point to speed up the translation process.

As an European charity promoting the use of Free Software as well as the importance of software freedom. One of our ways of reaching the Free Software community, and the society in general, is by offering our website and documents in several languages – translated by native speakers.
This hard work is mainly done by our hard-working volunteers and where the Translation Team come into play: our diverse and international groups of volunteers proofread and translate our content into many European languages. Warmly kudos to all of them!
One of the most useful tools that our translators are using is Webpreview. This Free Software tool is provided by the FSFE and created by our Deputy Coordinator of the Translation Team, Luca Bonissi. Webpreview helps our translators to share their proposed changes to our mailing list, preview how their changes might look on our website, have a live editor while translating and much more. Indeed, Webpreview is not only a tool for translators but for the rest of the team as it allows staffers to check out how a page or news item will look like before putting it online.
LibreTranslate and Webpreview
LibreTranslate is a Free Software project that provides a Machine Translation API, based on the Argos Translate library. The biggest addition in this release is its integration into Webpreview, which currently allows you to create a draft translation in six languages: English, Spanish, French, German, Italian, Portuguese - more will be coming soon!
You just need to choose in which language you need the text to be translated into and the machine gives you a first draft. Of course, every translation still goes through the care and insight of our dedicated volunteers, who proofread and check it making suggestions and taking the extra step that a machine cannot do.
Thanks to its simple API, we were able to easily integrate LibreTranslate into the codebase.
By using the existing command system of Webpreview, we added an
autotranslate
command. This command translates
chunks of text using the LibreTranslate API.
Here is how it works:
- When any webpage is loaded, it’s broken down into a tree-like structure made of elements (e.g. paragraphs, headers, links). This structure is called the DOM, and it lets us programmatically find and change parts of the page.
- The client walks through the DOM and looks for text elements like
paragraphs, quotes, and the like
(
Node.TEXT_NODE
). - The text extracted from these elements is sent to LibreTranslate through Webpreview for translation.
- The content of these elements is replaced with their translated version and becomes visible to the translator.
This design sends excerpts of text to LibreTranslate, which may lack some context from the overall page. One future improvement might be to consider sending the whole page using the built-in HTML format in the LibreTranslate API, which could potentially improve translation quality.
Markdown support
Webpreview now supports Markdown, allowing for easier content creation without having to deal with XHTML pages. This feature is powered by the SimpleMDE Markdown editor, some frontmatter parsing, and basic templating.
The underlying code for these changes is available to the public under a Free Software license.
Interested in helping grow the FSFE community? Consider joining our translation team to help make our content accessible in more languages!