Label translations for React

Overview

Sitefinity supports multiple languages and the React SDK is integrated into this. A wide range of labels are exposed for translation via Sitefinity localization feature and any configured language can used to translate the widgets interface.

Goal

This document provides insight on React powered templates localization features.

Prerequisite

Translations mapping

Each of the Hawksearch widgets comes with a JSON array that defines the mappings of exposed labels from the React SDK to the Sitefinity resources. It defines how these labels are translated and is a finite list of label keys. Any new labels that are created for the interface are added to the array and it usually doesn’t require any additional configuration.

Label translations

<script data-translations="react-translations" type="application/json">
    {
        "Narrow Results": "@Html.HtmlSanitize(Html.Resource("NarrowResults", "HawkWidgetsResources"))",
        "Search Results": "@Html.HtmlSanitize(Html.Resource("SearchResults", "HawkWidgetsResources"))",
        "Search Results for": "@Html.HtmlSanitize(Html.Resource("SearchResultsFor", "HawkWidgetsResources"))",
        "Sort By": "@Html.HtmlSanitize(Html.Resource("SortBy", "HawkWidgetsResources"))",
         ...
    }
</script>