Localización

Puede configurar la localización de su sitio web y añadir descripciones de artículos en varios idiomas. Esto le ayudará a ofrecer una experiencia más centrada en sus usuarios y aumentar la fidelidad a su juego. Puede localizar:

• Elementos generales del sitio web.
• Descripciones de artículos en el sitio web.
• Imágenes.

Localización del sitio web

Para localizar la interfaz del sitio web:

1. Abra el proyecto en Cuenta del editor.
2. Haga clic en Project Settings.
3. En la ventana General Settings, seleccione los idiomas a los que quiere localizar el sitio web.
4. En el campo Project Name, especifique el nombre del proyecto localizado en otros idiomas.
5. Haga clic en Save.
6. En el menú lateral, haga clic en Site Builder.
7. En la ficha de su sitio web, haga clic en Open Site Builder.
8. Vaya a la sección Language Settings y establezca los conmutadores de los idiomas necesarios en la posición On.
9. Elija la ubicación del botón de selección del idioma. En el panel Language selector position, seleccione Header o Footer.

Tras habilitar la localización, todos los elementos de la interfaz del sitio web se traducirán a los idiomas seleccionados. Por defecto, se usan los campos de texto y las traducciones preparadas por Xsolla. Para cambiar las traducciones por defecto, haga doble clic en el campo de texto e introduzca su propia versión.

Localización de nombres y descripciones de artículos

Para localizar las compras en el sitio web (p. ej., los artículos virtuales):

1. Abra el proyecto en Cuenta del editor.
2. Haga clic en Project Settings.
3. En la ventana General Settings, seleccione los idiomas a los que quiere localizar el sitio web.
4. En el campo Project Name, especifique el nombre del proyecto localizado en otros idiomas.
5. Haga clic en Save.
6. En el menú lateral, haga clic en Store.
7. En el módulo Virtual Items, haga clic en Configure o Connect.
8. Desde el menú desplegable, seleccione Create Item o pulse en Edit Item en el menú contextual de un artículo existente.
9. Añada el Nombre del artículo y la Descripción a todos los idiomas para los que haya habilitado la localización.

10. Haga clic en Save changes.
11. En el menú lateral, haga clic en Site Builder.
12. En la ficha de su sitio web, haga clic en Open Site Builder.
13. Vaya a la sección Language Settings y establezca los conmutadores de los idiomas requeridos en la posición On.
14. Vaya a la sección Store y seleccione el grupo de artículos para los que está establecida la localización.

Localización de imágenes

Puede agregar una imagen con texto escrito en un idioma específico a su sitio web empleando un código HTML personalizado. Puede usar una solución prediseñada o agregar su propio código.

Ejemplo de utilización de una solución existente

1. Abra su proyecto en Cuenta del editor.
2. En el menú lateral haga clic en Site Builder.
3. En la tarjeta de su sitio web, haga clic en Open Site Builder.
4. Vaya a la sección Language Settings y establezca los conmutadores para los idiomas requeridos en la posición On.
5. Agregue el siguiente contenido en el bloque Custom code:

1<div class="image-container">
2  <img class="localised-image lazy loaded" data-src="https://cdn.xsolla.net/merchant-bucket-prod/files/uploaded/sitebuilder/71070/bc6d3c723c6381e85fbb929563922ecb.jpg" />
3</div>

En la sección de CSS:

1.image-container {
2  text-align: center;
3  padding: 4em 1em;
4}
5
6.image-container img {
7  width: 100%;
8}

En la sección de JavaScript:

1. En el parámetro htmlLang especifique el idioma para el que va a agregar la imagen localizada.
2. En el parámetro localisedImage.dataset.src, especifique el enlace a la imagen localizada.

Para agregar varios idiomas para la localización, duplique los fragmentos de código JavaScript con los valores de parámetro necesarios.

 1const htmlLang = document.documentElement.lang;
 2const localisedImage = document.querySelector('.localised-image');
 3 if (htmlLang === 'es') {
 4
 5   localisedImage.dataset.src = 'https://cdn.xsolla.net/merchant-bucket-prod/files/uploaded/sitebuilder/71070/bc6d3c723c6381e85fbb929563922ecb.jpg';
 6 }
 7 if (htmlLang === ‘it’) {
 8
 9   localisedImage.dataset.src = 'https://cdn.xsolla.net/merchant-bucket-prod/files/uploaded/sitebuilder/71070/bc6d3c723c6381e85fbb929563922ecb.jpg';
10 }

6. Haga clic en Preview para ver los cambios. La imagen se localizará solamente para los idiomas que haya especificado en el bloque Custom Code.

Agregar su propio código

1. En Builder, haga clic en Add block y seleccione Custom code.

2. Inserte su propio código en el bloque.