워드프레스 WPML 플러그인으로 엘리멘터 템플릿 번역하기

WPML은 워드프레스 사이트를 다국어 사이트로 변환할 때 사용되는 플러그인으로 영어, 일본어, 중국어 등의 언어를 쉽게 추가할 수 있도록 합니다. WPML을 사용하여 원하는 언어를 추가한 후에 콘텐츠를 직접 번역하거나 자동번역 기능을 사용하여 번역할 수 있습니다. 엘리멘터 페이지 빌더로 헤더/푸터 등의 템플릿을 만든 경우 WPML로 템플릿을 각 언어로 번역이 가능합니다.

워드프레스 WPML 플러그인으로 엘리멘터 템플릿 번역하기

최근 WPML로 다국어 사이트를 만든 고객으로부터 푸터를 각 언어별로 번역하는 작업을 맡게 되었습니다. 사이트를 살펴보니 Elementor Pro의 테마 빌더로 영어 푸터 템플릿이 만들어져 있었습니다. 이 푸터를 독일어, 프랑스어, 네덜란드어 등의 언어로 번역하는 작업이었습니다.

이 작업을 수행하면서 느낀 점은 WPML과 엘리멘터 프로가 완벽히 호환되는 것 같지는 않았지만, 그렇다고 문제가 될 정도는 아니었습니다. 클라이언트께서 푸터 템플릿에 대하여 각 언어 버전을 추가했지만 푸터 콘텐츠가 각 언어 사이트에서 원하는 대로 표시되지 않았습니다.

이런 경우 기본 언어의 템플릿만 남겨두고 번역된 템플릿을 삭제한 다음, 처음부터 다시 시도해보면 잘 될 수 있습니다. 먼저는 각 언어별로 번역되었지만 문제를 일으키고 있는 템플릿을 삭제합니다.

그런 다음, 알림판에서 템플릿(Templates)를 클릭하고, 더하기 아이콘을 클릭하여 각 언어별 템플릿을 추가할 수 있습니다.  

위의 그림에서는 독일어 Header 템플릿을 추가하는 예를 보여줍니다.

템플릿을 각 언어별로 편집하려면 해당 국기 아래의 편집 아이콘(연필 모양의 아이콘)을 클릭하면 됩니다. 또는, 템플릿 이름 위에 마우스를 올리고 편집(Edit)을 클릭하여 번역 화면으로 이동할 수 있습니다.

왼쪽에 원문이 표시되고 오른쪽에 번역문이 표시됩니다.

다른 방법

위의 방법으로 잘 안 되는 경우, CSS로 처리하는 방법도 고려해볼 수 있습니다. :lang() 가상 클래스 선택자를 사용하면 해당 언어 속성에 기반하여 요소들을 일치시킬 수 있습니다. css-tricks.com의 :lang() 문서를 참고해보시기 바랍니다.

WPML vs. 멀티사이트

워드프레스에서 다국어 사이트를 만들고 싶은 경우, WPML과 같은 다국어 번역 플러그인을 사용하거나 멀티사이트를 이용할 수 있습니다.

WPMP과 멀티사이트는 장단점이 있습니다. 비용을 부담하지 않고 다국어 사이트를 구축하려면 멀티사이트를 이용하거나 무료 다국어 번역 플러그인을 사용할 수 있습니다.

다국어 번역 플러그인은 일부 테마와 호환되지 않을 수 있고, 커스텀을 많이 한 사이트에서도 잘 작동하지 않을 수 있습니다. 플러그인을 사용하여 다국어 사이트를 만들려고 할 때 오류가 발생하는 경우 멀티사이트로 시도해볼 수 있습니다. 실제로 몇 달 전에 아바다 테마로 만든 사이트가 커스텀이 많이 되어 WPML이 제대로 작동하지 않아서 멀티사이트로 다국어 버전을 추가한 적이 있습니다.

워드프레스 멀티사이트 다국어 버전 추가 작업

엘리멘터 페이지 빌더

엘리멘터는 현재 500만 개가 넘는 사이트에 설치될 정도로 큰 인기를 얻고 있습니다. 엘리멘터 프로에서는 프로 위젯과 함께 사이트의 모든 요소를 워드프레스 관리자 페이지 내에서 커스텀할 수 있는 기능이 제공됩니다. 엘리멘터 페이지의 다양한 사용법을 다음 페이지에서 확인해볼 수 있습니다.

• https://avada.tistory.com/tag/Elementor

엘리멘터와 같은 페이지 빌더는 코딩 지식이 없는 초보자도 쉽게 사이트를 만들 수 있다는 장점이 있습니다. 최근 인기 테마(예: 아바다, Divi, 뉴스페이퍼)와 페이지 빌더는 테마 파일을 수정하는 대신 워드프레스 알림판 내에서 사이트의 모든 요소를 편집할 수 있도록 전체 사이트 편집(Full Site Editing) 기능을 도입하는 추세입니다.

참고

https://avada.tistory.com/2581

워드프레스 엘리멘터 페이지 빌더 팝업 만들기

https://avada.tistory.com/2565

워드프레스 Divi 테마용 무료 카메라 제품 레이아웃 팩(Camera Product Layout Pack) 다운로드