Wix 도움말 센터
    홈
  1. 사이트 제작
  2. 다국어 사이트 제작
  3. 사이트 번역하기
    4. Wix 다국어: 다중상태 상자를 사용해 LTR에서 RTL로 변경하기

Wix 다국어: 다중상태 상자를 사용해 LTR에서 RTL로 변경하기

8 분 분량
주의사항:
검색 엔진 봇은 상자의 콘텐츠를 읽을 수 없으므로 다중 상태 상자를 추가하면 사이트의 SEO에 영향을 미칩니다. 
영어와 같은 일부 언어는 왼쪽에서 오른쪽(LTR)에서 표기되는 반면 히브리어 및 아랍어와 같은 언어는 오른쪽에서 왼쪽(RTL)으로 표기됩니다. 다국어 사이트에서 두 유형을 모두 지원하는 경우, 다중 상태 상자를 추가해 선택한 언어에 따라 콘텐츠를 다르게 표시할 수 있습니다. 이를 통해 각 언어별로 다른 '상태'를 생성하고 디자인을 개별적으로 조정할 수 있습니다. 
다중 상태 상자를 사용하는 라이브 Wix 사이트의 스크린샷
시작하기 전:
사이트에 Wix 다국어를 추가하고, Velo by Wix를 활성화하세요.

1 단계 | 사이트 주 언어 버전에 다중 상태 상자 추가하기

첫 번째 단계는 주 언어로 된 빈 다중상태 상자를 사이트에 추가하는 것입니다. 텍스트, 이미지, 버튼 또는 필요한 요소를 추가해 해당 언어에 맞게 디자인하세요. 
Wix 에디터
Studio 에디터
  1. 에디터로 이동합니다.
  2. 에디터 왼쪽에서 요소 추가를 클릭합니다. 
  3. 상자를 클릭합니다.
  4. 다중상태 상자를 클릭합니다.
  5. 빈 다중상태 상자를 페이지의 원하는 위치로 끌어다 놓습니다. 
  6. 상자에 요소를 추가하고 원하는 대로 디자인합니다.  
다중 상태 상자를 추가하는 Wix 사이트 스크린샷

2 단계 | 현재 상태 이름 변경하기

상자가 주 언어로 준비되면 상태 관리 패널을 열어 현재 상태의 이름을 바꿉니다. 추가하는 코드가 제대로 작동할 수 있도록 정확한 철자와 대문자로 "default"(따옴표 제외)라고 입력합니다.  
Wix 에디터
Studio 에디터
  1. 다중 상태 상자를 선택합니다.
  2. 상태 관리를 클릭합니다. 
  3. 현재 상태 이름 옆 추가 작업 아이콘을 클릭합니다.
  4. ID 편집을 선택합니다.
  5. 텍스트 상자에 "LTR"을 입력한 후 완료를 클릭합니다. 
다중 상태 상자를 사용하는 Wix 사이트의 스크린샷

3 단계 | 상태 복제 및 이름 변경하기

상태 관리 패널에서 "default" 상태를 추가한 후 이를 복제하고 새 상태의 이름을 "RTL"으로 변경합니다. 첫 번째 단계와 유사하게 코드가 제대로 작동할 수 있도록 정확한 철자와 구두점으로 RTL을 입력하는 것이 중요합니다. 
Wix 에디터
Studio 에디터
  1. 다중 상태 상자를 선택합니다.
  2. 상태 관리를 클릭합니다. 
  3. 현재 상태 이름 옆 추가 작업 아이콘을 클릭합니다.
  4. 복제를 선택합니다.
  5. 복제된 상태 옆 추가 작업 아이콘을 클릭합니다. 
  6. ID 편집을 선택합니다.
  7. 텍스트 상자에 "RTL"를 입력하고 완료를 클릭합니다. 
    참고: 보조 언어가 LTR인 경우에는 상태 이름을 LTR로 변경할 수 있습니다.   
다중 상태 상자를 사용하는 Wix 사이트의 스크린샷
참고:
다중 상태 상자의 요소 ID가 코드의 모든 부분에서 동일해야 합니다. 위 단계에서 예제 상자의 ID는 #statebox8입니다. 

4 단계 | 보조 언어로 상자 조정하기

이제 다중상태 상자가 설정되고 번역을 할 수 있습니다. RTL 언어로 변경하고 상태를 RTL로 변경한 다음 콘텐츠를 현지화해 보세요. 그런 다음, 코드 스니펫을 페이지 코드에 복사합니다. 
Wix 에디터
Studio 에디터
  1. 에디터 상단에서 언어 변경 드롭다운 메뉴를 클릭합니다. 
Wix 에디터 상단에서 언어 변경 드롭다운을 클릭하는 스크린샷.
  1. 편집하고자 하는 RTL 언어를 선택합니다. 
  2. 다중상태 상자 드롭다운을 클릭해 상자의 해당 상태를 선택합니다. 
다중 상태 상자를 사용하는 Wix 사이트의 스크린샷
  1. 상자에서 번역할 요소를 선택합니다.
    • 텍스트: 번역 편집 또는 자동 번역을 클릭해 텍스트를 번역합니다. 텍스트 설정 패널의 텍스트 방향 변경 아이콘을 클릭해 텍스트 방향을 전환합니다.
    • 이미지: 번역 편집을 클릭한 후 변경을 클릭해 사이트의 RTL 버전에 대해 다른 이미지를 선택합니다.
다중 상태 상자를 사용하는 Wix 사이트의 스크린샷
  1. 속성 패널에 다음 코드를 추가합니다.
    1. 에디터 왼쪽에서 페이지 코드 아이콘을 클릭합니다.
    2. 홈을 클릭합니다.
    3. 페이지 코드 탭에서 속성 패널 아이콘을 클릭합니다.
    4. 다중 상태 상자를 선택합니다.
    5. 아래의 다음 코드 스니펫을 복사해 코딩 패널에 붙여넣습니다.
중요!
코드는 오른쪽에서 왼쪽으로 읽는 언어에서 작동합니다. 언어를 왼쪽에서 오른쪽으로 읽는 경우, 코드에서 RTLLangs 정수 배열 콘텐츠(언어 코드)를 const rtllrangs = ['the','ar','fa']로 변경하세요.
1import wixWindow from 'wix-window';
2import wixWindow from 'wix-window';
3const RTLLangs = ['he', 'ar', 'fa'];
  1. onReady 함수에 다음 코드를 추가합니다.
1
2$w.onReady(function () {
3    let lang = wixWindow.multilingual.currentLanguage;
4    //based on RTL
5    /////////////////////////////////////
6    if (RTLLangs.includes(lang)) {
7        $w('#statebox8').changeState('RTL');
8    }else{
9        $w('#statebox8').changeState('LTR');
10    }
11});
Wix 에디터 코드 패널 스크린샷
  1. 코드를 검토하고 다중상태 상자의 ID가 정확하고 코드에 사용된 ID와 동일한지 확인합니다.
  2. 미리보기를 클릭해 다중 상태 상자를 테스트합니다.
  3. 변경사항을 라이브 사이트에 적용할 준비가 되었다면 사이트를 게시합니다.
더 많은 RTL 기능이 추가되길 원하시나요?
Wix 다국어를 사용해 오른쪽-왼쪽 콘텐츠가 포함된 다국어 사이트를 제작할 수 있습니다. 현재는 메뉴, 텍스트, 이미지 등과 같은 사이트 일부 측면을 언어별로 RTL 사용자 지정할 수 있습니다(예: 히브리어, 아랍어).

Wix 다국어에 어떤 RTL 기능이 추가되길 원하시나요? 고객지원 팀에 의견을 공유해 주세요.

도움이 되었나요?

|
페이지 메뉴
  • 1 단계 | 사이트 주 언어 버전에 다중 상태 상자 추가하기
  • 2 단계 | 현재 상태 이름 변경하기
  • 3 단계 | 상태 복제 및 이름 변경하기
  • 4 단계 | 보조 언어로 상자 조정하기