Skip to content

Translations

Intro

In Symfony2 applications, the strings and their translations are kept in .xliff/.yml files. In Xalok Next, the location of these files is app/public/Resources/translations. To keep translations in sync between the admin and public apps, this directory is linked in app/admin/Resources/translations.

Xalok Next integrates LexikTranslationBundle to make these strings editable in the backend interface (http://__ADMIN_URL__/translations). LexikTranslationBundle loads the strings from the translation files to the database.

Remote servers without git

Note: On remote servers where the git repository is not deployed, instead of the make commands listed below, you can run these scripts in your local (dev) installation, from the project's root, to connect to the remote server and run the equivalents of the make commands

For extracting:

shell
vendor/wfcms/standard/Wf/Bundle/CmsBaseAdminBundle/Resources/bin/translations-extract.sh -h [host] -d [project]

For saving:

shell
vendor/wfcms/standard/Wf/Bundle/CmsBaseAdminBundle/Resources/bin/translations-save.sh -h [host] -d [project] -p

Note that the translations-save.sh script accepts an optional -p parameter to commit and push the changes from your local repository (to gitlab).

Run either of these commands without any arguments to get help - it also includes an example on how to setup ~/.ssh/config to connect directly from local to the backend server, skipping the intermediate "bastion" (SSH gateway) step.

make translation-extract

To make translations available in the translations interface, they must be extracted from the sources and then loaded in the database. make translation-extract does these two tasks together.

make translation-save

When changes are done in the GUI, running make translation-save does the following:

  • it exports the translations from the DB back to the translation files, so the translations can be commited in the repository and shared accross installations. Please note that the public application doesn't use the LexikTranslationBundle, so the translations made in the GUI aren't available on the public app until this task is executed.
  • runs make wf_assets - there are strings that are used in the Javascript files of XalokNext. Please note that the changes made in the GUI aren't available to the Javascript environment until make wf_assets isn't executed
  • creates a commit with the changes (if any) made to the translation files and pushes these changes to origin

⚠️ Besides the translations, the .xliff translation files also contain some metadata. If the translations are made on two (or more) different installations, it's very likely to get a big number of conflicts when trying to merge the translations between the two installations. For this reason, we recommend managing the translations on a single installation (the PRE environment is a good fit for this).

Dynamic Translations

There are some cases where the CMS uses dynamic strings to generate translations. To make these strings available in the interface, they should be added to the /src/__PROJECT_NAMESPACE__/Bundle/CmsAdminBundle/Resources/views/i18n.html.twig. All these keys are searched in the WfCmsAdmin catalogue.

There are three types of keys that are generated dynamically:

  • admin_submenu.content.create.TEMPLATE - the template names' displayed in the Create submenu
  • listing.filter.FILTER_NAME - the translation of the filter name for automated listings
  • wf.search.type.TEMPLATE - the name of the type template displayed in the advanced search form.

JavaScript Translations

The editor needs translations to be dumped to a JS file: /bundles/wfcmsbaseadmin/javascripts/i18n/default.js. As these translations are compiled by webpack, to see these translations reflected in the backend, you need to clear the cache and run make wf_assets to recompile the new translations in the resulting JS file

v4

In v4 working with translations in JavaScript has been greatly simplified. Setting the wfcms_admin.js_autocollect_translations parameter to true will make JavaScript files automatically add the strings that are not found in the dumped translation to the translation tables used internally by LexikTranslationBundle, making the strings translatable.

IMPORTANT: The translations would still have to be saved by the translation-save task above (either locally or through the methods described in Remote servers without git). To avoid merge conflicts, this parameter should be enabled in a single environment, PRE, for example, or, if the project has such a thing, the environment used for internal testing (before deploying the changes to PRE to be shown to the client) would be an even better place.

v3

This file is generated by CmsAdminBundle:Javascript:i18nAction. The twig used for this is /src/__PROJECT_NAMESPACE__/Bundle/CmsAdminBundle/Resources/views/Javascript/i18n.js.twig. In order to make the translations available in the editor, you have to add them here. The base twig defines some blocks that are used throughout the editor:

custom_modules_add block

Translations appearing in the "Add module" dialog

html
{% block custom_modules_add %}
    'admin/composite/article_opinion':'{{ 'admin/composite/article_opinion'|trans({}, 'WfCmsAdmin') }}',
{% endblock %}

custom_switch_modules block

Translations appearing in the toolbar for modules that have wf-group

html
{% block custom_switch_modules %}
    'admin/composite/poll':'{{ 'admin/composite/poll'|trans({}, 'WfCmsAdmin') }}',
{% endblock %}

custom_toolbar_styles_translations block

Translations appearing in a body_text module, for the dropdown allowing the editor to change the style of a text (wf-styles="blue,red")

html
{% block custom_toolbar_styles_translations %}
    'blue':'{{ 'toolbar.styles.blue'|trans({}, 'WfCmsAdmin') }}',
    'red':'{{ 'toolbar.styles.red'|trans({}, 'WfCmsAdmin') }}',
{% endblock %}

v4.0 custom_module_editor_dialog block

Translations appearing in popup box when edit button of a module is clicked. Default types are page, image, video, audio, poll, file.

html
{% block custom_module_editor_dialog %}
    'audio':'{{ 'module_edit_dialog.page'|trans({}, 'WfCmsAdmin') }}',
{% endblock %}