Sur cette page
Que pouvez-vous faire avec WPML GraphQL ?
Interroger les informations de langue et de traduction
Interroger des articles spécifiques dans plusieurs langues
Interroger les données des langues installées
Fonctionnalités clés
Filtrez le contenu par langue, y compris les articles, les taxonomies, les commentaires, les menus et les éléments de menu
Étendez WPGraphQL avec des champs de langue pour récupérer des données spécifiques à partir de l’extension WPML
Requêter des données dans toutes les langues installées ou se concentrer sur des langues spécifiques
Plugins requis
Pour commencer, installez et activez les plugins suivants :
- WPGraphQL
- WPML
- WPML String Translation
- WPML GraphQL
Pour inclure des champs multilingues de l’extension ACF dans le schéma WPGraphQL, installez également :
- Advanced Custom Fields Multilingual (ACFML)
- WPGraphQL for Advanced Custom Fields
Que pouvez-vous faire avec WPML GraphQL ?
WPML GraphQL s’intègre à WPGraphQL pour vous permettre d’interroger le contenu multilingue créé avec WPML.
Depuis GraphQL → GraphQL IDE, vous pouvez utiliser le Query Composer pour :
- Obtenez des informations sur la langue pour tout contenu que vous interrogez
- Accédez aux traductions pour les articles, les taxonomies et les commentaires
- Filtrer vos requêtes par langue
- Interrogez des articles spécifiques dans plusieurs langues par leur ID ou leur slug
Par exemple, comme le montre l’image ci-dessous, vous pouvez facilement afficher une liste de tous les articles de votre site, avec leurs codes de langue, slugs, URI et les détails de leurs traductions.
Utilisation des champs de langue dans le Query Composer pour récupérer des articles dans toutes les langues
Ci-dessous, nous utiliserons un site de test multilingue pour vous montrer comment utiliser WPML GraphQL pour interroger le contenu et ses traductions.
Interroger les informations de langue et de traduction
Avec WPML GraphQL, vous pouvez utiliser les champs language et translation dans vos requêtes :
- Le champ
languagevous permet de récupérer des détails tels que le code de langue, l’URL du drapeau du pays, le nom natif, le nom traduit et l’URL de la page d’accueil pour les types d’articles, les taxonomies, les menus, les éléments de menu et les commentaires. - Le champ
languageCoderécupère le code de langue pour les articles, les termes de taxonomie, les menus, les éléments de menu et les commentaires sans détails de langue supplémentaires. - Le champ
translationsrécupère les traductions pour les types d’articles et les termes de taxonomie.
Lorsque vous interrogez des commentaires, les champs language et languageCode correspondent à la langue de l’article auquel ils appartiennent.
Voici un exemple de requête qui récupère les articles ainsi que leurs détails associés, y compris le slug de l’article, l’URI, le code de langue, les catégories et toutes les traductions existantes :
query Posts{
posts(where: {language: "en"}) {
nodes {
slug
uri
language {
code
}
categories {
nodes {
name
}
}
translations {
slug
uri
language {
code
}
categories {
nodes {
name
}
}
}
}
}
}
L’exécution de cette requête renvoie des informations sur la langue et la traduction pour chaque article, ainsi que les éléments connectés comme les catégories. Les connexions suivent automatiquement la langue de l’élément de niveau supérieur (les articles dans ce cas) :
{
"data": {
"posts": {
"nodes": [
{
"slug": "bye-world",
"uri": "/2023/05/18/bye-world/",
"language": {
"code": "en"
},
"categories": {
"nodes": [
{
"name": "Fin de journée"
},
{
"name": "Salutations"
}
]
},
"translations": [
{
"slug": "adios-mundo",
"uri": "/es/2023/05/18/adios-mundo/",
"language": {
"code": "es"
},
"categories": {
"nodes": [
{
"name": "Fin de journée"
},
{
"name": "Salutations"
}
]
}
},
{
"slug": "tchau-mundo",
"uri": "/pt-pt/2023/05/18/tchau-mundo/",
"language": {
"code": "pt-pt"
},
"categories": {
"nodes": [
{
"name": "Fin de journée"
},
{
"name": "Salutations"
}
]
}
}
]
},
{
"slug": "hello-world",
"uri": "/2018/07/05/hello-world/",
"language": {
"code": "en"
},
"categories": {
"nodes": [
{
"name": "Salutations"
},
{
"name": "Début de journée"
}
]
},
"translations": [
{
"slug": "hola-mundo",
"uri": "/es/2018/07/05/hola-mundo/",
"language": {
"code": "es"
},
"categories": {
"nodes": [
{
"name": "Début de journée"
},
{
"name": "Salutations"
}
]
}
},
{
"slug": "ola-mundo",
"uri": "/pt-pt/2018/07/05/ola-mundo/",
"language": {
"code": "pt-pt"
},
"categories": {
"nodes": [
{
"name": "Début de journée"
},
{
"name": "Salutations"
}
]
}
}
]
}
]
}
}
}
Filtrage des langues
WPML GraphQL vous permet d’utiliser le filtre language pour :
- Filtrer les articles, les termes de taxonomie, les menus, les éléments de menu ou les commentaires par une langue spécifique
- Récupérer du contenu dans une langue particulière en réglant le filtre en conséquence
- Obtenir tout le contenu, quelle que soit la langue, en réglant la valeur du filtre sur all
WPML GraphQL prend en charge les connexions, de sorte que lorsque vous filtrez un élément de niveau supérieur comme un article par langue, tous les éléments liés, tels que les catégories et les étiquettes, suivront automatiquement la même langue. Cela rend vos requêtes cohérentes et précises.
Voici un exemple de requête qui récupère des articles en espagnol, y compris leurs slugs, URI et catégories connectées :
query PostsES{
posts(where: {language: "es"}) {
nodes {
slug
uri
categories {
nodes {
name
}
}
}
}
}
Voici ce que la requête renvoie :
{
"data": {
"posts": {
"nodes": [
{
"slug": "adios-mundo",
"uri": "/es/2023/05/18/adios-mundo/",
"categories": {
"nodes": [
{
"name": "Fin de journée"
},
{
"name": "Salutations"
}
]
}
},
{
"slug": "hola-mundo",
"uri": "/es/2018/07/05/hola-mundo/",
"categories": {
"nodes": [
{
"name": "Début de journée"
},
{
"name": "Salutations"
}
]
}
}
]
}
}
}
Interroger des articles spécifiques dans plusieurs langues
Avec WPML GraphQL, vous pouvez également interroger des articles individuels dans n’importe quelle langue par leur ID d’article ou leur slug.
Par exemple, si vous avez un article intitulé ¡Hola mundo! (la traduction espagnole de Hello world !), avec un slug hola-mundo et un ID d’article 2, vous pouvez utiliser les requêtes suivantes pour récupérer l’article :
query PostBySlug {
post(id: "hola-mundo", idType: SLUG) {
title
slug
uri
}
}
query PostById {
post(id: "2", idType: DATABASE_ID) {
title
slug
uri
}
}
Les deux requêtes renverront correctement les données de l’article, y compris le titre, le slug et l’URI, pour l’article ¡Hola mundo! :
{
"data": {
"post": {
"title": "¡Hola mundo!",
"slug": "hola-mundo",
"uri": "/es/2018/07/05/hola-mundo/"
}
}
}
Interroger les données des langues installées
WPML GraphQL fournit deux requêtes pour accéder aux données sur les langues installées sur votre site :
- La requête languages récupère toutes les langues enregistrées ainsi que les données pertinentes pour chacune
- La requête defaultLanguage récupère des informations sur la langue par défaut définie sur votre site
Ces requêtes peuvent être utiles si vous cherchez à créer des fonctionnalités telles qu’un sélecteur de langue.
Par exemple, pour obtenir des données sur toutes les langues installées, vous pouvez exécuter la requête suivante :
query Languages {
languages {
code
country_flag_url
default_locale
native_name
translated_name
url
}
}
La requête ci-dessus produit le résultat suivant :
{
"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/"
}
]
}
}
Utiliser WPML GraphQL avec ACF
Si vous utilisez WPGraphQL avec l’extension ACF, les modules complémentaires WPML GraphQL et ACFML (ACF Multilingual) étendent cette fonctionnalité. Cela vous permet d’interroger les données des champs personnalisés dans différentes langues.
WPGraphQL avec son extension ACF expose les pages d’options ACF en tant qu’objets racines. Ensemble, WPML GraphQL et les modules complémentaires ACFML ajoutent un paramètre de langue aux requêtes de page d’options, attendant un code de langue correspondant à l’une des langues actives sur votre site (par exemple « de », « pt-pt »). Cela vous permet d’interroger les données dans une langue spécifique :
query NewQuery {
myOptionPage(language: "de") {
addressFieldGroup {
addressTitle
repeaterAddressDetails {
addressDetails
}
}
}
}
Débuter avec WPML GraphQL
Pour utiliser WPML GraphQL, vous avez besoin d’un forfait WPML Multilingual CMS ou WPML Multilingual Agency. Les deux forfaits donnent accès à l’extension WPML et à une large gamme de modules complémentaires, tous inclus sans frais supplémentaires.
Découvrez quel forfait est le mieux adapté à votre site.
Besoin d’aide ?
Si vous rencontrez des difficultés pour utiliser WPML GraphQL, consultez notre page Problèmes connus et solutions pour obtenir des conseils de dépannage.
Besoin d’aide supplémentaire ? Soumettez un ticket de support.
