현지화

웹 사이트의 현지화를 설정하고 다양한 언어로 아이템 설명을 추가할 수 있습니다. 이를 통해 좀 더 고객 중심적인 서비스를 제공하고 게임에 대한 충성도를 높일 수 있습니다. 현지화를 수행할 수 있는 아이템:

• 일반 사이트 요소.
• 사이트 내 아이템 설명.
• 이미지.

사이트 현지화

웹 사이트 인터페이스를 현지화하는 방법:

1. 관리자 페이지에서 프로젝트를 엽니다.
2. 프로젝트 설정을 클릭합니다.
3. 일반 설정 창에서 사이트를 현지화할 언어를 선택합니다.
4. 프로젝트 이름 필드에서 다른 언어로 현지화된 프로젝트 이름을 지정합니다.
5. 저장을 클릭합니다.
6. 사이드 메뉴에서 스토어프런트 > 웹 사이트를 클릭합니다.
7. 사이트 카드에서 웹 사이트 빌더 열기를 클릭합니다.
8. 언어 설정 섹션으로 이동하여 필요한 언어의 스위치를 On(켜짐)으로 설정합니다.
9. 언어 선택 버튼이 위치할 곳을 선택합니다. 언어 선택기 위치 패널에서 헤더 및/또는 바닥글을 선택합니다.

현지화를 활성화하면 웹 사이트 인터페이스의 모든 요소가 선택한 언어로 번역됩니다. 기본적으로 엑솔라에서 준비한 텍스트 필드와 번역이 사용됩니다. 기본 번역을 변경하려면 텍스트 필드를 두 번 클릭하고 원하는 버전을 입력합니다.

아이템 이름 및 설명 현지화

사이트에서 구매를 현지화하는 방법(예: 가상 아이템):

1. 관리자 페이지에서 프로젝트를 엽니다.
2. 프로젝트 설정을 클릭합니다.
3. 일반 설정 창에서 사이트를 현지화할 언어를 선택합니다.
4. 프로젝트 이름 필드에서 다른 언어로 현지화된 프로젝트 이름을 지정합니다.
5. 저장을 클릭합니다.
6. 아이템 카탈로그 > 가상 아이템 섹션으로 이동합니다.
7. 드롭다운 메뉴에서 아이템 생성을 선택하거나 기존 아이템의 컨텍스트 메뉴에서 아이템 편집을 클릭합니다.
8. 현지화를 활성화한 모든 언어에 아이템 이름 및 설명을 추가합니다.

9. 변경 사항 저장을 클릭합니다.
10. 사이드 메뉴에서 스토어프런트 > 웹 사이트를 클릭합니다.
11. 사이트 카드에서 웹 사이트 빌더 열기를 클릭합니다.
12. 언어 설정 섹션으로 이동하여 필요한 언어에 대한 스위치를 온으로 설정합니다.
13. 스토어 섹션으로 이동하여 현지화가 구성된 아이템 그룹을 선택합니다.

이미지 현지화

사용자 정의 HTML 코드를 사용하여 특정 언어로 작성된 텍스트가 포함된 이미지를 웹 사이트에 추가할 수 있습니다. 기성 솔루션을 사용하거나 직접 코드를 추가할 수 있습니다.

기존 솔루션 사용 예시

1. 관리자 페이지에서 프로젝트를 열고 스토어프런트 > 웹 사이트 섹션으로 이동합니다.
2. 사이트 카드에서 웹 사이트 빌더 열기를 클릭합니다.
3. 언어 설정 섹션으로 이동하여 필요한 언어의 스위치를 On(켜짐)으로 설정합니다.
4. 다음 내용을 사용자 정의 코드 블록에 추가합니다.

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>

CSS 섹션에서:

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

JavaScript 섹션에서:

1. htmlLang 매개 변수에서 현지화된 이미지를 추가할 언어를 지정합니다.
2. localisedImage.dataset.src 매개 변수에서 현지화된 이미지에 대한 링크를 지정합니다.

현지화를 위해 여러 언어를 추가하려면 필요한 매개 변수 값이 있는 JavaScript 코드 조각을 복제합니다.

 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 }

5. 미리 보기를 클릭하여 변경 사항을 확인합니다. 이미지는 사용자 정의 코드 블록에서 지정한 언어에서만 현지화됩니다.

자체 코드 추가

1. 빌더에서 블록 추가를 클릭하고 사용자 지정 코드를 선택합니다.

2. 자체 코드를 블록에 삽입합니다.