이 튜토리얼에서는 Stitched와 WPML로 다국어 사이트를 만드는 방법을 배웁니다. Stitched는 장인을 위한 테마로, 홈페이지 소개 구성 요소를 사용하여 방문자에게 자신을 알릴 수 있으며 통합할 수 있는 권장 플러그인을 설치하여 기능을 확장할 수 있습니다.
Stitched는 WooThemes에서 개발했습니다. 테마 및 WooThemes에서 개발한 플러그인의 경우 WooThemes/플러그인이 코드에서 사용하는 특수 기능의 번역을 위해 WPML에 내장된 GUI를 사용하는 것을 권장합니다. 이 튜토리얼에서는 이를 원활하게 수행하는 방법을 단계별로 안내합니다.
Stitched + WPML 데모 사이트에서 실제 예시를 확인할 수 있습니다.
WPML로 다국어 Stitched 사이트를 운영하려면 다음이 필요합니다.
- Stitched 테마
- 문자열 번역 및 번역 관리 모듈이 포함된 최신 버전의 WPML
시작하기
시작하기 위해 따라야 할 주요 단계는 다음과 같습니다.
- Stitched 설치 및 활성화
- WPML 플러그인(WPML Multilingual CMS, WPML 문자열 번역, WPML 번역 관리) 설치 및 활성화
- WPML->언어에서 WPML을 설정합니다. 전체 참조는 WPML 시작하기 가이드를 확인하세요.
- Stitched와 통합할 수 있는 여러 플러그인 중 하나를 설치하고 활성화합니다. 이 튜토리얼에서는 Projects를 사용합니다.
소개 메시지 번역
Stitched 테마의 ‘소개 메시지(Introductory Message)’ 기능은 사이트 관리자의 Gravatar 이미지와 사이트 태그라인 텍스트의 조합입니다. WPML을 사용하면 글, 페이지 및 택소노미의 일부가 아닌 모든 텍스트(또는 문자열)는 문자열 번역 모듈을 사용하여 번역됩니다.
해당 텍스트는 설정 > 일반에서 설정합니다.
이제 번역하려면 WPML->문자열 번역으로 이동하여 해당 문자열을 찾은 다음
, 번역하고 완료로 표시한 후 저장합니다.
설정에 따라 테마가 자동으로 가져오는 Gravatar 이미지를 포함하여 프런트엔드가 현재 표시되는 모습은 다음과 같습니다.
일반 텍스트 번역
Stitched에는 번역하고 싶을 수 있는 몇 가지 문자열이 더 포함되어 있습니다. ‘소개 메시지’에서 설명한 대로 WPML의 문자열 번역 모듈을 사용하여 누락된 번역을 완료할 수 있습니다. 일부 문자열이 누락된 경우 테마 및 플러그인 현지화 지침을 따르세요. 간단히 말해 WPML->테마 및 플러그인 현지화로 이동하여 ‘문자열에 대한 테마 스캔’을 클릭합니다. 컨텍스트 드롭다운에서 올바른 문자열을 쉽게 필터링할 수 있습니다. Stitched의 경우 ‘theme woothemes’로 필터링하고 ‘Projects 플러그인’의 경우 ‘plugin projects-by-woothemes’로 필터링하면 다음과 같이 표시됩니다.
통합된 플러그인 번역
이제 테마에서 제공하는 모든 텍스트를 번역하는 방법을 살펴보았으므로, Woo 플러그인에서 제공하는 문자열과 기능도 번역할 수 있게 만드는 방법을 알아보겠습니다. 이 튜토리얼에서는 Stitched와 함께 사용하도록 권장되는 아주 유용한 플러그인인 ‘Projects by WooThemes’를 선택했습니다.
‘Projects’를 설치하고 활성화하면 다음과 같이 WordPress 관리 화면에 ‘projects’라는 새 메뉴가 표시됩니다.
프로젝트 및 해당 카테고리를 번역할 수 있도록 만들려면 WPML 설정(WPML GUI)을 사용합니다. 기본적으로 다음과 같이 WPML->번역 관리로 이동합니다.
상단 탭에서 다국어 콘텐츠 설정을 선택합니다.
계속하기 전에 백그라운드에서 실제로 어떤 일이 일어나고 있는지 간단히 설명하겠습니다. 다른 많은 플러그인(및 테마)과 마찬가지로 Projects 플러그인은 기능을 위해 사용자 정의 글 유형을 사용합니다. 이는 일종의 ‘특수’ 글이며, 특수하기 때문에 WPML은 이를 번역해야 한다는 것을 ‘알지’ 못합니다. 따라서 다음 단계는 WPML에 Projects를 번역하라고 정확히 알려주는 것입니다!
사용자 정의 글을 클릭하고 Projects에 대해 번역을 선택합니다. 보시다시피 Projects 슬러그도 번역 가능하도록 설정할 수 있으며, 바로 아래에서 이러한 사용자 정의 글과 관련된 사용자 정의 분류체계(이 경우 ‘Project categories’라고 함)를 번역할 수 있습니다. 이제 저장만 하면 됩니다. 같은 방식으로 상단의 사용자 정의 필드 번역 링크를 클릭하여 사용자 정의 필드가 번역을 위해 처리되는 방식을 제어할 수 있습니다. Projects의 경우 _client, _project_image_gallery 및 _url의 3가지 사용자 정의 필드를 설정할 수 있지만, 이에 대해서는 다음 항목을 따르는 것을 권장합니다.
Projects 관리 페이지가 어떻게 생겼는지 살펴보겠습니다. 관리 화면에서 ‘Projects’를 클릭하면 이제 일반적인 페이지나 글과 마찬가지로 기존 프로젝트를 복제하거나 번역하고, 원하는 언어로 새 프로젝트를 만들 수 있습니다. 그리고 매우 중요한 점은 글 유형 프로젝트의 전체 기능을 사용할 수 있다는 것입니다. 이 경우 세부 정보, 설명 및 제공되는 특수 갤러리를 다음과 같이 추가할 수 있습니다.
사용자 정의 글 편집 페이지에서 사용자 정의 필드(및 기타 항목)를 번역 가능하게 만들기
마지막으로, 이전 화면에서 눈치채셨겠지만, 글의 각 편집 페이지에서 사용자 정의 필드와 심지어 택소노미 및 글 유형이 번역을 위해 처리되는 방식도 제어할 수 있습니다. 조금 확대해 보겠습니다.
여기서는 _project_image_gallery가 언어 간에 복사되기를 원하며, _client 및 _url 필드는 번역하지 않고 두는 것이 타당하다고 생각합니다. 번역된 글 페이지에서 여전히 이를 변경할 수 있지만 굳이 번역할 필요는 없습니다.
언어 전환기 스타일링
마지막으로 WPML 언어 전환기가 Stitched 기본 네비게이션에 완벽하게 통합되도록 약간 수정해 보겠습니다. WPML 언어 전환기에는 필요에 따라 스타일을 지정할 수 있는 클래스가 추가되어 있으며, 원한다면 전체 사용자 정의 언어 전환기를 만들 수도 있습니다. 여기서는 그럴 필요가 없으며, 국기가 어색해 보이지 않고 제자리에 ‘안착’하도록 약간의 패딩만 주면 됩니다.
이를 수행하려면 WPML->언어->언어 전환기 옵션->추가 CSS (선택 사항)으로 이동하여 전환기의 국기 이미지 스타일을 제어하는 클래스인 img.iclflag에 약간의 패딩을 추가합니다.
이제 다른 Stitched 메뉴 항목처럼 매우 멋지게 보입니다.
결론
Stitched는 다국어를 지원하고 전 세계에 자신과 프로젝트를 알리기에 매우 좋은 테마이며, WooCommerce 및 WPML Multilingual & Multicurrency for WooCommerce를 사용하여 상점을 추가할 수도 있습니다. WPML을 사용하여 기능을 원활하게 조정하는 방법을 살펴보았습니다.
사용된 버전
- WordPress 3.9
- WPML 3.1.5
- Stitched 테마 1.0.2
- Projects 플러그인 1.2.0
