diff --git a/docs/content_management/create_edit_content_items.md b/docs/content_management/create_edit_content_items.md index 953ddd22..eb4d7f36 100644 --- a/docs/content_management/create_edit_content_items.md +++ b/docs/content_management/create_edit_content_items.md @@ -135,7 +135,7 @@ Invited users can either edit the Rich Text fields or only preview the content ( You can edit embedded content items without leaving current window. To do it, first insert selected content item in the Rich Text field. -Then, click the three dots icon on the right side and click **Edit**. +Then, click the three dots icon and click **Edit**. ![Edit embedded content item](img/edit_embedded_item_richtext.png "Edit embedded content item") diff --git a/docs/content_management/img/adding_translation.png b/docs/content_management/img/adding_translation.png index 5c234fed..d0577fd9 100644 Binary files a/docs/content_management/img/adding_translation.png and b/docs/content_management/img/adding_translation.png differ diff --git a/docs/content_management/img/compare_translations.png b/docs/content_management/img/compare_translations.png index 1b4658c9..9729c24d 100644 Binary files a/docs/content_management/img/compare_translations.png and b/docs/content_management/img/compare_translations.png differ diff --git a/docs/content_management/img/managing_translations_sxs_view.png b/docs/content_management/img/managing_translations_sxs_view.png new file mode 100644 index 00000000..466a8465 Binary files /dev/null and b/docs/content_management/img/managing_translations_sxs_view.png differ diff --git a/docs/content_management/img/side_by_side_view.png b/docs/content_management/img/side_by_side_view.png new file mode 100644 index 00000000..5af7216c Binary files /dev/null and b/docs/content_management/img/side_by_side_view.png differ diff --git a/docs/content_management/img/translate_from_content_tree.png b/docs/content_management/img/translate_from_content_tree.png new file mode 100644 index 00000000..dc7aee96 Binary files /dev/null and b/docs/content_management/img/translate_from_content_tree.png differ diff --git a/docs/content_management/img/translation_preview_impossible.png b/docs/content_management/img/translation_preview_impossible.png new file mode 100644 index 00000000..ea6ecfbb Binary files /dev/null and b/docs/content_management/img/translation_preview_impossible.png differ diff --git a/docs/content_management/img/translations_collapse_source.png b/docs/content_management/img/translations_collapse_source.png new file mode 100644 index 00000000..fc4c2cff Binary files /dev/null and b/docs/content_management/img/translations_collapse_source.png differ diff --git a/docs/content_management/img/translations_copy_source.png b/docs/content_management/img/translations_copy_source.png new file mode 100644 index 00000000..ed136946 Binary files /dev/null and b/docs/content_management/img/translations_copy_source.png differ diff --git a/docs/content_management/img/translations_create_translation.png b/docs/content_management/img/translations_create_translation.png new file mode 100644 index 00000000..58e1508e Binary files /dev/null and b/docs/content_management/img/translations_create_translation.png differ diff --git a/docs/content_management/img/translations_distraction_free_mode.png b/docs/content_management/img/translations_distraction_free_mode.png new file mode 100644 index 00000000..0e9ae53d Binary files /dev/null and b/docs/content_management/img/translations_distraction_free_mode.png differ diff --git a/docs/content_management/img/translations_management_language_pairs.png b/docs/content_management/img/translations_management_language_pairs.png new file mode 100644 index 00000000..2c925fa4 Binary files /dev/null and b/docs/content_management/img/translations_management_language_pairs.png differ diff --git a/docs/content_management/img/translations_review_banner.png b/docs/content_management/img/translations_review_banner.png new file mode 100644 index 00000000..70d17791 Binary files /dev/null and b/docs/content_management/img/translations_review_banner.png differ diff --git a/docs/content_management/img/translations_review_status.png b/docs/content_management/img/translations_review_status.png new file mode 100644 index 00000000..d9ad9c8d Binary files /dev/null and b/docs/content_management/img/translations_review_status.png differ diff --git a/docs/content_management/translate_content.md b/docs/content_management/translate_content.md index 57f53183..4ac7eda5 100644 --- a/docs/content_management/translate_content.md +++ b/docs/content_management/translate_content.md @@ -1,5 +1,5 @@ --- -description: Create multiple language versions of content items. +description: Create multiple language versions of content items and products. --- # Translate content @@ -8,6 +8,11 @@ The content on your website can be translated into different languages. Each content item can have different language versions. The version visible to a visitor depends on the way your installation is set up (see [SiteAccess concept](#edit-page-for-different-language-versions-of-a-website)). +!!! tip "Translations management LTS Update" + + If the [Translations management](#translations-management) LTS Update is installed in your system, [[= product_name =]] offers a side-by-side translation view that displays the source and target languages simultaneously. + It makes it easier for you to provide, edit and review translations. + ## Add website languages You can only add translations in languages that have been set up for your website in the **Admin** panel. @@ -17,11 +22,17 @@ To do it, go to the **Admin** panel, open the **Languages** tab, and click **Add Every new language must have a name and a language code written in the xxx-XX format, for example, eng-US, fre-FR, or nor-NO. After adding a language, you may have to reload the application to be able to use it. +!!! note "Previewing translations" + + You can only preview content items translated to languages that have a corresponding website configured in that language. + + ![Preview limitation](img/translation_preview_impossible.png "Preview limitation") + !!! caution Depending on the way the website is set up, additional configuration may be necessary for the new translations to be displayed properly. Contact your administrator and inform them that you need to add a new language to the website. - For more information, see [Developer Documentation on language versions]([[= developer_doc =]]/multisite/languages/languages/)). + For more information, see [Developer Documentation on language versions]([[= developer_doc =]]/multisite/languages/languages/). ## Add translations @@ -44,7 +55,22 @@ the same way as when editing only one language.
-### Automated translation +## Edit page for different language versions of a website [[% include 'snippets/experience_badge.md' %]] [[% include 'snippets/commerce_badge.md' %]] + +When you edit a page, a bar at the top of the screen lists the most recently used [SiteAccesses](multisite.md#siteaccess) on your website. +Use this bar to switch between the different versions and work on them. + + + +!!! note "SiteAccess concept" + + SiteAccesses are a means to present different versions of the website to different categories of users. + You could treat SiteAccesses as different "entrance points" to your website. + They allow you to show different content or design to visitors, for example, to serve different language versions to visitors from different countries. + + See [Work with websites](../website_organization/work_with_sites.md) for more information about setting up websites. + +## Automated translation If your application comes with a [properly configured automated translation feature]([[= developer_doc =]]/multisite/languages/automated_translations), you can have your content machine-translated into multiple languages by using external translation services like Google Translate and DeepL. @@ -76,17 +102,220 @@ The screen refreshes to display the side by side view of its fields. For more information, see [Work with versions](work_with_versions.md#compare-versions). -## Edit page for different language versions of a website [[% include 'snippets/experience_badge.md' %]] [[% include 'snippets/commerce_badge.md' %]] +## Translations management [[% include 'snippets/lts-update_badge.md' %]] -When you edit a page, a bar at the top of the screen lists the most recently used [SiteAccesses](multisite.md#siteaccess) on your website. -Use this bar to switch between the different versions and work on them. +If the translations management feature [is installed and properly configured]([[= developer_doc =]]/multisite/languages/translations_management) in your system, the set of features available for [content item](content_items.md) and [product](products.md) translation changes: - +- Application administrators can [define language pairs and assign translation services](#manage-translation-services-and-language-pairs) to them. +- Content editors get a redesigned translation interface called [side-by-side translation view](#side-by-side-translation-view). If at least one automated translation provider is configured, editors can use it here to machine-translate content. -!!! note "SiteAccess concept" +!!! note "Translations management limitations" - SiteAccesses are a means to present different versions of the website to different categories of users. - You could treat SiteAccesses as different "entrance points" to your website. - They allow you to show different content or design to visitors, for example, to serve different language versions to visitors from different countries. + Content types that use Page Builder or Form Builder do not support the side-by-side translation view and open in the standard single-language editor instead. - See [Work with websites](../website_organization/work_with_sites.md) for more information about setting up websites. + When a content type that uses Page Builder is automatically translated, only the page's title and description are translated. + When a content type that uses Form Builder is automatically translated, only the forms's title is translated. + + Also, product attributes are not translatable and they are inactive in the side-by-side translation view. + +### Manage translation services and language pairs + +If you have Administrator permissions, you can enable and disable translation services and assign them to language pairs. +Enabling at least one translation service is required before the editors can use automatic translation. + +#### Translation services + +To see the translation services that are available in your system, go to **Admin** -> **Languages** -> **Translation services** tab. + +The tab lists all translation services that have been [configured by the developer]([[= developer_doc =]]/multisite/translations_management/configure_translations_management/#configure-translation-providers). +Each service shows its name, vendor, and whether it is enabled. +Disabled services do not appear as choices in the **Create a new translation** modal. + +#### Language pairs + +To manage language pairs, go to **Admin** -> **Languages** -> **Language pairs** tab. + +A language pair setting decides which translation service is used by default when an editor translates from one specific language to another. +When an editor opens the **Create a new translation** modal and selects a source and target language, a matching translation service gets pre-selected, and the editor can override this selection. + +To add a language pair: + +1. Click **+ Add language pair**. +2. Select a source language. +3. Select one or more target languages. +4. Select a translation service. +5. Click **Save and close**. + +![Creating a language pair](img/translations_management_language_pairs.png "Creating a language pair") + +This creates one language pair per selected target language. + +!!! note + + If a language pair for a given source-to-target combination already exists, even for a disabled translation service, you cannot create another one with a different service. + Edit the existing language pair instead. + To do it, you may need to temporarily re-enable the disabled services, so that all language pairs appear on the screen. + +### Side-by-side translation view + +The side-by-side translation view displays the source and target text of the content item or product on one screen. +This way you can add, modify or review translations in context without having to switch between tabs or windows. + +The back office offers several entry points where you can access the side-by-side translation view, for example: + +- Content item's **Translations tab** — Go to **Content** -> **Content structure**, select a content item, open the **Translations** tab, and click **+ Add**. +- Product's **Translations tab** — Go to **Product catalog** -> **Products**, select a product, open the **Translations** tab, and click **+ Add**. +- **Content tree** — Click a three dot icon next to a content item in the content tree and, in the context menu, click **Add translation**. +- **Content edit view** — When you choose to edit a content item and several language versions exist, the **Edit side-by-side** button is active for all languages that differ from the main language of the content item. + +#### Source and target columns + +Depending on [user settings](get_started.md#user-settings), the source language column appears on the left or right of the side-by-side view. +By default, the source is on the left. + +Non-translatable fields are inactive in the source column, but they remain active in the translation column. +This way you can, for example, replace images with their localized counterparts. + +![Side-by-side translation view](img/managing_translations_sxs_view.png "Side-by-side translation view") + +Like in the standard content item editor, when multiple sections or field groups exist within the content item or product, anchors appear at the top of the side-by-side translation view to help you jump directly to a specific section. + +The view also supports the [distraction-free mode](create_edit_content_items.md#distraction-free-mode), where longer texts in both columns can be scrolled in a synchronized way. + +![Distraction-free mode](img/translations_distraction_free_mode.png "Distraction-free mode") + +#### Change source language + +When a content item or product has multiple published language versions, a drop-down list appears at the top of the source column. +You can use the dropdown list to change the language that is displayed in the source column. + +#### Copy content from source + +The divider between the source and target columns contains a **Copy all from source** button. +Click it to copy all translatable field values from the source column into the target fields in a single action. +Values of all fields are copied at the same time. + +![Copy all from source button](img/translations_copy_source.png "Copy all from source button") + +!!! caution + + When you copy content from source after a target column has been translated, it overrides all existing translations. + This action can't be reverted. + +The button is absent if you switch to the [distraction-free mode](create_edit_content_items.md#distraction-free-mode). + +#### Hide the source + +When the source is placed on the right, the divider between the source and target columns contains a **Collapse source language** button. +The button toggles the source panel visibility, allowing editors to hide the source text when they no longer need it. + +![Collapse source button](img/translations_collapse_source.png "Collapse source button") + +### Add new translation + +1. Either click **+ Add** in the content item's or product's **Translations** tab, or **Add translation** in the content tree. + +![Starting the translation from the content tree](img/translate_from_content_tree.png "Starting the translation from the content tree") + +2\. In the **Create a new translation** modal, select the source and target languages. + +!!! note "Draft conflict" + + If a draft translation of the content item already exists for the selected target language, a warning appears in the modal to inform you about this fact. + You can proceed and add a new draft, or discard the modal and edit the existing draft translation. + + Products don't have draft translations. + + For more information, see [Edit existing translations](#edit-existing-translations). + +3\. If **Use automatic translation** is checked, select a translation provider from a drop-down list. + +You may prefer to translate the content by yourself. +To do it, uncheck **Use automatic translation** and proceed. + +![Create a new translation modal](img/translations_create_translation.png "Create a new translation modal") + +If no translation providers are configured in the system, the checkbox is inactive. +If only one provider exists in the system, there is a checkbox, but no drop-down list. + +4\. Click **Open side-by-side**. + +The [side-by-side translation view](#side-by-side-translation-view) opens with the source text in one column and the target form in the other. +Depending on whether you chose to use automatic translations, target fields can be empty or pre-translated. + +!!! note "Reviewing automatic translations" + + If you chose to use automatic translations, the side-by-side view allows you to approve or reject the translation. + For more information, see [Review automatic translation](#review-automatic-translation). + +5\. When you work with a product, **Save and close** publishes the translation and **Discard** removes it completely. + +6\. When you work with other content items, you have multiple options to quit editing and preserve the translation, while **Delete draft** removes it completely. + +### Edit existing translations + +The back office offers several entry points where you edit existing content item or product translations. + +To edit a published translation of a content item: + +- In content tree, select a content item and click **Edit**. If more than one language version of a content item exists, a list of all available translations is displayed in the **Select translation** modal. Select a language and click the **Edit side-by-side** button. + +To edit a translation of a product: + +- Go to **Product catalog** -> **Products**, select a product, and open the **Translations** tab. +Then, next to a language version that you want to edit, click the **Edit side-by-side** button. + +This opens the side-by-side translation view, where you can perform a review or make your changes and either publish directly or create a new draft. + +!!! tip + + The **Edit side-by-side** button is active only for languages other than the main language of the content item or product. + +To edit a draft translation of a content item: + +- In content tree, select a content item and open the **Versions** tab. Click a three dot icon next to a draft translation that you want to edit and, in the context menu, click **Edit side-by-side**. +- In the main menu, go to **Content** or visit the **My dashboard** page, and go to **Drafts**. Find a draft whose source and target languages differ and click **Edit side-by-side**. + +This opens the existing draft in the side-by-side translation view, so you can review and refine a translation without creating a new draft. + +!!! tip + + Products don't have draft translations. + +### Review automatic translation + +If a content item or product has draft translations created with automatic translation, the **Versions** tab displays a **Translation status** column. +Such drafts are marked with one of the following badges: + +- **For review** — You must review and approve the translation before it can be published. +- **Translated** — The translation has been accepted and you can publish it. + +Draft translations that were created manually don't have a badge. + +![Review status badges in the Versions tab](img/translations_review_status.png "Review status badges in the Versions tab") + +When you create and open an automatic translation or open a draft translation of a content item that has "For review" status in the side-by-side view, a review banner appears at the bottom of the screen, which allows you to accept or reject the translation. + +![Review banner in the side-by-side view](img/translations_review_banner.png "Review banner in the side-by-side view") + +#### Reject translation + +On the review banner, click **Reject** to mark the translation as requiring further work. +The review banner hides but it reappears the next time you open the translation. +The **For review** status in the **Versions** tab remains unchanged. + +You can reject a translation multiple times, but you can't reject a translation that has been accepted. + +!!! tip + + Rejecting a translation of a product does not unpublish it. + To unpublish a product translation you must delete it in the **Translations** tab. + +#### Accept translation + +On the review banner, click **Accept** to mark the translation as reviewed and approved. +The review banner disappears forever and the status changes from **For review** to **Translated**. + +Accepting a translation of a content item does not mean that it is published. +You still need to save and publish the draft. +You can also close the draft without publishing. diff --git a/docs/getting_started/dashboard/work_with_dashboard.md b/docs/getting_started/dashboard/work_with_dashboard.md index a0b987c3..8f73d165 100644 --- a/docs/getting_started/dashboard/work_with_dashboard.md +++ b/docs/getting_started/dashboard/work_with_dashboard.md @@ -141,7 +141,7 @@ The following actions are available: ## Edit dashboard At any time you can edit an active customized dashboard. -To do it, click the three dots icon in the top right corner, and then click **Edit...**. +To do it, click the three dots icon in the top corner, and then click **Edit...**. ![Edit dashboard](edit_active_dashboard.png "Edit dashboard") @@ -172,4 +172,4 @@ Select the dashboard to be set as active, and click **Save**. You can also select active dashboard and switch between default and customized dashboard in the main dashboard view. Click the three dots menu and use the **Switch to...** action. -![Switch between dashboards](switch_dashboard.png "Switch between dashboards") \ No newline at end of file +![Switch between dashboards](switch_dashboard.png "Switch between dashboards") diff --git a/docs/getting_started/get_started.md b/docs/getting_started/get_started.md index 5aa17c7e..8fa52deb 100644 --- a/docs/getting_started/get_started.md +++ b/docs/getting_started/get_started.md @@ -125,6 +125,8 @@ Here you can [change your user password](get_started.md#change-the-password) and |Help center|Enables or disables the [help center](discover_ui.md#help-center). [[% include 'snippets/lts-update_badge.md' %]]| |Product tour|Enables or disables the [product tour onboarding](#onboarding) walkthroughs. [[% include 'snippets/lts-update_badge.md' %]]| |Product tour scenarios settings|Separate setting for each available product tour scenario. Allows you to mark each scenario as completed or reset its progress. [[% include 'snippets/lts-update_badge.md' %]]| +|Side-by-side layout|Decides on which side of the screen the target language column should be displayed in the [side-by-side translation view](translate_content.md#side-by-side-translation-view). [[% include 'snippets/lts-update_badge.md' %]]| +|Automatic translation for new items|Controls the behavior of the [**Create a new translation** modal](translate_content.md#add-new-translation). When activated, the **Use automatic translation** checkbox is selected and the default translation service for the language pair is preselected. Inactive when no automated translation services are defined. [[% include 'snippets/lts-update_badge.md' %]]| #### Mode diff --git a/docs/getting_started/notifications.md b/docs/getting_started/notifications.md index f71b60f4..0930420e 100644 --- a/docs/getting_started/notifications.md +++ b/docs/getting_started/notifications.md @@ -29,7 +29,7 @@ If you have already received notifications and didn't act on then, a number of n Click the notification icon to view a short list with the most recent notifications, arranged from newest to oldest. Here, you can click certain notifications in the short list to act on them, according to their originator's request. -You can click the three dots icon on the right side of each individual notification and mark it as read or delete it. +You can click the three dots icon next to each individual notification and mark it as read or delete it. You can also click **Mark all as read** to mark all notifications as read. ![Short list of notifications](notifications_short_list.png "Short list of notifications") diff --git a/docs/product_catalog/products.md b/docs/product_catalog/products.md index 61b55e30..315e6c8c 100644 --- a/docs/product_catalog/products.md +++ b/docs/product_catalog/products.md @@ -47,7 +47,7 @@ It lists all tasks required for product configuration, including: - variants (if any of the attributes is enabled for variants) - availability - prices in different currencies -- translations +- [translations](translate_content.md) ![Product completeness screen](img/product_completeness.png "Product completeness screen")