Make playground translation ready

WordPress / wordpress-playground

Run WordPress in the browser via WebAssembly PHP

https://w.org/playground/

GNU General Public License v2.0

1.64k stars 259 forks source link

Make playground translation ready #1991

Open MaggieCabrera opened 5 days ago

MaggieCabrera commented 5 days ago

I am at a Spanish WordCamp and we've been extensively using Playground for contributor day and workshops. We have the translation team here and we were wondering if the Playground interfaces were translatable. I think when you change the WP language the Playground interface should update to the selected language if a translation is available for it.

If you make playground translation ready, you already have translators waiting on it to translate into Spanish at least :)

bgrgicak commented 4 days ago

Playground isn't translatable today, but it would be wonderful if we could get there.

Here are a few thoughts on how we could get there.

Most strings from the Playground UI should live in the Website package, so we could start by making this package translatable.
We could use the @wordpress/i18n package to implement translation support.
It would be great if translators could use translate.wordpress.org and Playground would download translation files from there.

adamziel commented 2 days ago

Looping in @akirk @amieiro – how would you go about making Playground translatable with the existing WordPress infrastructure? Technically, we're talking about a React app. One idea is packaging the code as a WordPress plugin. It's not ideal, as there would be no actual way to use that plugin, but it's something. Do you have any other ideas ?

amieiro commented 1 day ago

In the Meta project we have a similar situation: the Openverse project. This project uses Nuxt.js/Vue.js.

They have the English strings in a JSON file. They use these strings in the frontend to be able to translate them.

E.g., the about.title.description key is used here, using {openverse} as placeholder to be updated in runtime. They get the translations from the JSON file.

  about: {
    title: "About {openverse}",
    description: {
      content: "{openverse} is a tool that allows openly licensed and public domain works to be discovered and used by everyone.",
    },

We could have a similar situation:

At translate.w.org, create a Playground project as a Meta subproject, similar to the Openverse.
In Playground, create a similar solution, with a JSON file or another interchange format like po.
At translate.w.org, add Playground to the import system.
Add this project to the export system, to create the files with the translations.

bgrgicak commented 1 day ago

Playground heavily uses WordPress components. We should also consider how to make these strings translatable.