Versions Compared

Old Version 4

changes.mady.by.user gabriel.georgiev

Saved on

compared with

New Version Current

changes.mady.by.user Toma Bonev

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Overview

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

Goal

This document provides insight on Vue.js powered templates localization features.

Prerequisite

Info

Configured Hawksearch box or results widget using the Vue template

https://hawksearch.atlassian.net/wiki/spaces/CON/pages/605618600/Configuring%2BHawksearch%2Bbox%2BWidget

Setup Hawksearch box with Enable Vue.js for Hawksearch box widget

Configuring ' Hawksearch results ' WidgetSetup Hawksearch results with widget

Enable Vue.js for Hawksearch results widget

Translations mapping

Each of the Hawksearch widgets comes with a JSON array that defines the mappings of exposed labels from the Vue 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

Code Block
<script data-translations="vue-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>

...