이 페이지에서:
- 필수 플러그인 및 설정
- WPML GraphQL 스키마 살펴보기
- 언어 및 번역 정보 쿼리하기
- 언어 필터링
- 설치된 언어에서 데이터 쿼리하기
- 개츠비 및 ACF와 함께 WPML GraphQL 사용
- 알려진 문제
- 지원 받기
필수 플러그인 및 설정
시작하려면 다음 플러그인을 설치하고 활성화하세요:
- WPML 코어 플러그인 및 문자열 번역 애드온
- WPGraphQL 플러그인
- WPML GraphQL 플러그인
ACF 또는 ACF Pro가 있는 사이트를 운영 중이고 ACF 플러그인의 다국어 필드를 WPGraphQL 스키마에 노출하려면 설치 및 활성화하세요:
- 고급 사용자 지정 필드 다국어(ACFML ) 플러그인
- 고급 사용자 정의 필드용 WPGraphQL 플러그인
WPML GraphQL 스키마 살펴보기
WPML GraphQL WPGraphQL과 통합되어 새로운 필드와 필터를 WPGraphQL 스키마에 추가합니다.
플러그인을 설치한 후 GraphQL → GraphQL IDE로 이동하여 쿼리 작성기를 사용하여 다양한 언어로 콘텐츠를 쉽게 쿼리하고 필터링할 수 있습니다. 여기에는 다음이 포함됩니다:
- 쿼리된 개체의 언어에 대한 정보 얻기
- 글 유형, 분류법, 댓글 등의 객체에 대한 번역을 가져옵니다.
- 언어별로 쿼리된 개체 필터링하기
예를 들어, 아래 이미지는 언어 코드, 슬러그 및 URI를 포함하여 WordPress 사이트의 모든 글 목록과 각 글의 번역에 대한 유사한 정보를 검색하는 방법을 보여줍니다.
WPML GraphQL 작동 방식을 보여주기 위해 영어를 기본 언어로 설정하고 스페인어와 이탈리아어를 보조 언어로 설정한 사이트를 설정했습니다. 이 문서 페이지에서는 이 테스트 사이트를 사용하여 WPML 만든 게시물 및 게시물 번역을 쿼리합니다.
언어 및 번역 정보 쿼리하기
WPML GraphQL 사용하면 쿼리에 언어 및 번역 필드를 포함할 수 있습니다. 이 에서 GraphQL의 노드 및 요소로 작업하여 언어별 데이터 및 관련 번역을 검색할 수 있습니다.
- 쿼리에 언어 필드를 추가하여 게시물 유형, 분류 체계 및 댓글의 언어를 표시할 수 있습니다. 이 쿼리는 다음과 같은 광범위한 언어 정보를 제공합니다:
- 언어 코드
- 국가 국기 URL
- 언어의 기본 이름
- 언어의 번역된 이름
- 홈페이지 URL
- 언어코드 필드를 사용하여 다른 언어별 세부 정보를 요청하지 않고도 글, 분류 용어 및 댓글의 언어 코드를 수집할 수 있습니다.
- 번역 필드를 사용하여 게시물 유형 및 분류 체계 용어의 번역을 검색할 수 있습니다.
아래에서 이러한 필드가 포함된 글에 대한 쿼리 예시를 볼 수 있습니다.
WPML GraphQL query for posts using the language and translations fields
query Posts{
posts(where: {language: "en"}) {
nodes {
slug
uri
language {
code
}
translations {
slug
uri
language {
code
}
}
}
}
}
이 쿼리를 실행하면 각 리소스에 대한 언어 및 번역 정보가 반환됩니다.
WPML GraphQL outcome of the query for posts using the language and translations fields
{
"data": {
"posts": {
"nodes": [
{
"slug": "bye-world",
"uri": "/bye-world/",
"language": {
"code": "en"
},
"translations": [
{
"slug": "adios-mundo",
"uri": "/es/adios-mundo/",
"language": {
"code": "es"
}
},
{
"slug": "addio-mondo",
"uri": "/it/addio-mondo/",
"language": {
"code": "it"
}
}
]
},
{
"slug": "hello-world",
"uri": "/hello-world/",
"language": {
"code": "en"
},
"translations": [
{
"slug": "hola-mundo",
"uri": "/es/hola-mundo/",
"language": {
"code": "es"
}
},
{
"slug": "ciao-mondo",
"uri": "/it/ciao-mondo/",
"language": {
"code": "it"
}
}
]
}
]
}
}
}
언어 필터링
WPML GraphQL 플러그인에는 언어 필터가 장착되어 있어 쿼리를 세분화하여 원하는 언어 데이터를 정확하게 얻을 수 있습니다.
언어 필터를 사용하여 특정 언어를 기준으로 글, 분류 용어 또는 댓글을 필터링할 수 있습니다. 쿼리에 언어 필터를 포함하여 특정 언어의 노드를 요청할 수 있으며, 값을 모두로 설정한 언어 필터를 사용하여 언어에 관계없이 모든 항목을 검색할 수도 있습니다.
다음은 보조 언어인 스페인어를 기준으로 게시물을 필터링하는 쿼리 예시입니다:
WPML GraphQL query using the language filter
query PostsES{
posts(where: {language: "es"}) {
nodes {
slug
uri
}
}
}
보시다시피 이 쿼리는 스페인어로 된 모든 게시물을 가져옵니다.
WPML GraphQL outcome of the query using the language filter
{
"data": {
"posts": {
"nodes": [
{
"slug": "adois-mundo",
"uri": "/es/adios-mundo/"
},
{
"slug": "hola-mundo",
"uri": "/es/hola-mundo/"
}
]
}
}
}
설치된 언어에서 데이터 쿼리하기
WPML GraphQL 사이트에 설치된 언어의 데이터를 쿼리할 수 있는 두 가지 쿼리를 정의합니다:
- 등록된 모든 언어와 각 언어에 대한 관련 데이터를 가져오는 언어 쿼리입니다.
- 기본 언어로 설정된 언어를 관련 데이터와 함께 가져오는 defaultLanguage 쿼리입니다.
예를 들어 언어 전환기를 만들려는 경우 유용할 수 있습니다.
설치된 모든 언어에 대한 데이터를 쿼리하고 싶다고 가정해 보겠습니다. 이를 위해 다음 쿼리를 실행합니다:
WPML GraphQL query to get all registered languages
query Languages {
languages {
code
country_flag_url
default_locale
native_name
translated_name
url
}
}
위의 쿼리는 다음과 같은 결과를 생성합니다:
WPML GraphQL outcome of the query to get all registered languages
{
"data": {
"languages": [
{
"code": "en",
"country_flag_url": "http://site.com/wp-content/plugins/sitepress-multilingual-cms-release/res/flags/en.svg",
"default_locale": "en_US",
"native_name": "English",
"translated_name": "English",
"url": "http://site.com"
},
{
"code": "es",
"country_flag_url": "http://site.com/wp-content/plugins/sitepress-multilingual-cms-release/res/flags/es.svg",
"default_locale": "es_ES",
"native_name": "Español",
"translated_name": "Spanish",
"url": "http://site.com/es/"
},
{
"code": "it",
"country_flag_url": "http://site.com/wp-content/plugins/sitepress-multilingual-cms-release/res/flags/it.svg",
"default_locale": "it_IT",
"native_name": "Italiano",
"translated_name": "Italian",
"url": "http://site.com/it/"
}
]
}
}
개츠비 및 ACF와 함께 WPML GraphQL 사용
개츠비 프레임워크를 사용하면 WordPress 사이트를 비롯한 다양한 백엔드 소스에서 데이터를 수집할 수 있습니다.
WordPress 사이트에서 WP GraphQL을 사용하는 경우 해당 데이터를 개츠비 사이트에 제공할 수 있습니다. WPML GraphQL 설치하면 다양한 언어로 데이터를 제공하고 언어 정보를 검색할 수도 있습니다.
추가 기능을 제공하기 위해 WP GraphQL에는 고급 사용자 정의 필드(ACF)를 위한 애드온이 있습니다. 이 애드온을 WPML ACF 다국어 플러그인과 함께 사용하면 특정 언어 요구 사항에 따라 핵심 데이터와 사용자 정의 필드 데이터를 모두 제공할 수 있습니다.
예시 시나리오를 살펴봅시다: WordPress 백엔드에서 데이터를 검색하는 gatsby-source-graphql 애드온 패키지가 포함된 Gatsby가 설치되어 있습니다. 이 WordPress 백엔드에서:
- 스페인어를 보조 언어로 설정하여 WPML 설치했습니다.
- ACF를 설치하고 글에 대한 텍스트 필드(슬러그 부제목)가 포함된 필드 그룹(슬러그 포스트 필드)을 추가했습니다.
- 일부 데이터를 채웠습니다.
간단한 GraphQL 쿼리를 통해 이 데이터를 수집할 수 있습니다.
아래 쿼리 예시에서는 언어가 영어로 설정된 WordPress 백엔드에서 글을 검색합니다. 각 글에 대해 제목, 언어 코드 및 자막과 같은 ACF 필드 데이터에 액세스할 수 있습니다. 또한 제목, 언어 코드 및 ACF 필드 데이터를 포함하여 게시물의 번역을 검색할 수 있습니다.
WPML GraphQL example query for language-specific information and ACF field data
export const doQuery = graphql`
{
wordpress {
posts(where: {language: "en"}) {
nodes {
title
language {
code
}
postfields{
subtitle
}
translations {
title
language {
code
}
postfields{
subtitle
}
}
}
}
}
}
`;
Known Issues
WPML은 이 플러그인과 잘 작동하지만, 때때로 우리가 해결하고 있는 작은 문제가 발생할 수 있습니다. 이는 두 플러그인 모두 자주 업데이트를 제공하기 때문에 예상되는 일입니다.
현재 해결되지 않은 문제들:
- WPML GraphQL - Missing Translated Menu Support
- WPML GraphQL – No Results for Slug Queries in Secondary Languages
- WPML GraphQL - Cannot Retrieve Translated Author Metadata
- WPML GraphQL - Fails to Fetch Single Custom Post Type by Slug Based
이 플러그인에 대해 이전에 해결된 문제를 포함하여 알려진 모든 문제를 검색할 수도 있습니다.
지원 받기
WPGraphQL과 함께 WPML GraphQL 사용하는 데 도움이 필요하면 지원 포럼으로 이동하세요.