rburgst/wp-graphql-wpml

a wordpress plugin that improves wpgraphql usage together with wpml

WPGraphQL WPML Extension

• Contributors: rburgst
• Stable tag: 1.1.0
• Tested up to: 5.6.1
• Requires at least: 4.9
• Requires PHP: 7.0
• Requires WPGraphQL: 0.8.0+
• Requires WPML: 4.4.5+
• Tags: GraphQL, WPML, WPGraphQL
• License: GPL-3
• License URI: https://www.gnu.org/licenses/gpl-3.0.html

Description

Adds WPML functionality to wpgraphql so that translations can be queried and WPML default filters which disable the listing of all content are disabled.

Note that the primary use case for this plugin is to be used together with Gatsby where you can perform all filtering of your content within the Gatsby GraphQL schema.

Since Gatsby pulls the whole content out of the wordpress database, this plugin will ensure that all translations of the translated content is being returned (instead of only content in the default language).

If you dont intend to use this plugin together with Gatsby be aware that you will typically have to be creative with filtering, see #8, #9.

Thanks to https://github.com/shawnhooper/wpml-rest-api and https://github.com/valu-digital/wp-graphql-polylang

Caveats

In case you are getting issues querying data (i.e. http 302, or errors), please first try to see whether you can successfully query data without this plugin.

If it does not work without this plugin, then enabling this plugin wont magically heal your broken ACF config (see also #5). This plugin will only help in getting "more" content from your wordpress installation (which was previously disabled by WPML interfering with queries).

Limitations

Due to the main use case of using this plugin together with gatsby some often required filtering options are not yet available, such as

• filtering menus by locale/language (see #3)

wp-graphql-wpml's Issues

Translated taxonomies aren't returned

I created a custom post type with a custom taxonomy. But the translated terms aren't exposed to the graphql api.

Would you be open to a restructure of the plugin?

Hello @rburgst,

Thanks for your continuing work on this plugin and merging in my changes from PR #10.

I am working on some changes to add returning translations for taxonomies in the same way we do for posts. While working on this functionality, it struck me that the plugin is getting pretty large. Would you be open to a PR that restructures a bit?

I'm thinking something like this:

• Class-based with a namespace - wrap all of the functions in a namespaced class, which would shorten the function names considerably
• Main class as a singleton - use the singleton pattern to initialize the plugin and maintain a single instance
• Multiple files - break out the functionality related to new types, fields, menus, posts, and taxonomies (and other) into new files - that would help us find and manage the additions and changes a little easier. In other words, organize the plugin code around the core objects being used/impacted.
• Remove commented code - given that we are using Git we can safely remove commented code
• Add a little more documentation to functions - I don't have all the information for what the functions do but I can add documentation for those that I understand 😁

Overall, I am getting a strong pull to re organize things and figured I would ask before taking the time to do it.

Thanks again!
Don

Add a locale "where" arg

Hello @rburgst,

Thanks for working on this plugin.

I would like to add a "where" argument in the GraphQL query to be able to fetch only one language by one language. It can seems a little bit strange but it's just because I will use 2 domains, then, I will deploy my app twice and the idea is to use env var.

So, how can I do it?

Thanks again!

Fetch all available languages

Hi!
First off, thanks for developing this plugin! 🚀

I have a question about something that would be really nice to get from this plugin. It would be really good if the plugin created a node for all the available languages on a site. Does anyone know how to achieve this?

Something like this:

  # Get all configured languages
    languages {
        name
        code
    }

Thanks!

Incompatibility with WPGraphQL WooCommerce (WooGraphQL) and WooCommerce

Adding a product to the cart is giving an error, while it is working with WPML and WPGraphQL WPML disabled.
I tried to send the query from GraphiQL IDE, Postman and my Next.js app.

The query:
mutation MyMutation {
addToCart(input: {productId: 32009, clientMutationId: "asdasd", quantity: 1}) {
cartItem {
key
}
}
}

The error:
{
"errors": [
{
"debugMessage": "Call to a member function get_cart_from_session() on null",
"message": "Internal server error",
"extensions": {
"category": "internal"
},
"locations": [
{
"line": 2,
"column": 3
}
],
"path": [
"addToCart"
],
"trace": [
{
"file": "/wp-content/plugins/wp-graphql-woocommerce/includes/mutation/class-cart-add-item.php",
"line": 93,
"call": "WPGraphQL\WooCommerce\Data\Mutation\Cart_Mutation::check_session_token()"
},

The website: https://dev.supplybeaver.ca/
Versions:
WPGraphQL WPML - 1.0.7
WPML Multilingual CMS - 4.5.1
WPGraphQL WooCommerce (WooGraphQL) - 0.10.6
WooCommerce - 5.9.0
WP GraphQL - 1.6.7

I am creating the same issue for WPGraphQL WooCommerce (WooGraphQL), as I don't know on which side exactly the issue is.
I really hope that it will be possible to use a combination of these plugins on my website soon.
Thank you!

When WPML extension is active, menuItems query returns ALL menu items throughout the site

So it always worked for me but for some reason menuItems is returning all Menu items from everywhere.
My query is

query getNavItems {
  menuItems(where: {location: PRIMARY}) {
    nodes {
      title
      path
      label
      locations
    }
  }
}

And my response still is>

{
  "data": {
    "menuItems": {
      "nodes": [
        {
          "title": null,
          "path": "/register/",
          "label": "Register",
          "locations": null
        },
        {
          "title": null,
          "path": "/",
          "label": "Home",
          "locations": [
            "PRIMARY"
          ]
        },
        {
          "title": null,
          "path": "/support/",
          "label": "Support",
          "locations": null
        },
        {
          "title": null,
          "path": "/blog/",
          "label": "Blog",
          "locations": [
            "PRIMARY"
          ]
        },
        {
          "title": null,
          "path": "/try/",
          "label": "Try",
          "locations": null
        },
        {
          "title": null,
          "path": "/about/",
          "label": "About",
          "locations": [
            "PRIMARY"
          ]
        },
        {
          "title": null,
          "path": "/contact/",
          "label": "Contact",
          "locations": [
            "PRIMARY"
          ]
        },
        {
          "title": null,
          "path": "/pricing/",
          "label": "Pricing",
          "locations": [
            "PRIMARY"
          ]
        },
        {
          "title": null,
          "path": "/try/",
          "label": "Try",
          "locations": [
            "PRIMARY"
          ]
        },
        {
          "title": null,
          "path": "/pricing/",
          "label": "Pricing",
          "locations": [
            "PRIMARY"
          ]
        }
      ]
    }
  },
  "extensions": {
    "debug": [
      {
        "type": "DEBUG_LOGS_INACTIVE",
        "message": "GraphQL Debug logging is not active. To see debug logs, GRAPHQL_DEBUG must be enabled."
      }
    ]
  }
}

Gatsby does not create node for regionalized pages

Hi,

I can query regionalized pages (like pages under /en-gb) on the WordPress graphQL IDE interface. But when Gatsby creates the nodes locally, those pages do not show on the local graphQL queries (using the same id as in the query above) and they show a 404 when I try to access them on the browser. Besides having the plugin installed, do I need to do anything special during the build process? Thanks,

Support for Yoast SEO WPGraphQL plugin

I'm looking to retrieve translations of Yoast data through GraphQL. So far, it seems that neither the Yoast SEO WPGraphQL plugin, nor this plugin have support for it. I opened an issue with the mentioned plugin as well.

I am hoping support can be added, or if it is already possible somehow, that someone could explain to me how to do it. If there is no support for it yet, I may be able to work (with someone else) on a PR sometime in the near future. My client wishes to initially launch their website with a single language, but as soon as other languages need to be added, I will be devoting time to this.

URI of translated page on front should not contain the slug

Hello, thank you for your work.

My issue is that when a static page is set as "Page on front" in WordPress and the translation page for it is created, they have the following URI patterns in the CMS:

mydomain.com/
mydomain.com/LOCALE/

In other words, the front page slug or the post name is removed from the URL.

However, this is not the case when the translated page is retrieved in GraphQL.
We have instead:

/
/LOCALE/translated-page-slug/

Can this issue be be addressed by this plugin or it should be fixed within a different layer?

Thanks.

Fetch translated categories and tags

Hi! Thanks for your plugin, it has been already very useful for me!
I would like to know if it could also give the translated categories and tags.

Currently when fetching all the posts there are only categories and tags for the posts in the main language. There rest appear empty:

Even if I query specifically for all the categories and tags like below, which would be an alternative, I only get the ones in the main language. It would be great to get all with their locale to be able to filter them.

query MyQuery {
  tags {
    nodes {
      name
    }
  }
  categories {
    nodes {
      name
    }
  }
}

Maybe I am missing something and this is already possible. They do appear in the translated versions of the posts.

I need to eventually consume this data from Gatsby.

Querying pages set as child throws an error when WPML is enabled

Hi,

I am getting an error when querying pages that are set as child of other pages, and it seems related to WPML.
The error says: "SyntaxError: Unexpected token < in JSON at position 0".

If I have only WPGraphQL enabled it works fine and I can fetch all the pages. However if I enable WPML I get this error when fetching any page that has a parent. It doesn't matter if the pages have translations or not.

Has anybody experienced something similar?

Thanks in advance for any feedback!

Languages menu missing after Wordpress 6.1.1 update

After we updated to Wordpress 6.1.1, we no longer see the menu in other languages. GraphQL IDE does not retrieve the data either. GraphQL Version 1.13.7 and WPGraphQL WPML Version 1.1.0

No language data when query from external

wp-graphlql is working fine for default language.

i installed wp-graphql-wpml but when i send my query. The data for for the second language is empty. It works fine with the GraphIQL.

My query
query MyQuery { menus { nodes { name slug menuItems(where: {parentId: "null"}) { nodes { title label } } } } }
response external
{ "name": "Hauptmenü", "slug": "hauptmenue", "menuItems": { "nodes": [] } }

response GraphIQL
{ "name": "Hauptmenü", "slug": "hauptmenue", "menuItems": { "nodes": [ { "title": null, "label": "Umsatzsteuer" } ] } }

do have any ideas? thanks for your reply

Not working with Next.js and language switch

I'm running into a problem when I query posts for different languages.

Versions used:
WP GraphQL: 1.8.1
WPGraphQL WPML: 1.1.0

My GQL query looks like so:

export const getAllPostsForHome = gql`
  query AllPosts($locale: String) {
    posts(
      first: 6
      where: { orderby: { field: DATE, order: DESC }, wpmlLanguage: $locale }
    ) {
      nodes {
        content
        excerpt
        date
        title
        slug
        databaseId
        featuredImage {
          node {
            title
            sourceUrl
          }
        }
      }
    }
  }
`;

With the variable locale I assumed I can then query the posts like so:

export async function getStaticProps(context) {
  const { locale } = context;

  const posts = await client.query({
    query: getAllPostsForHome,
    variables: {
      wpmlLanguage: locale,
    },
  });

  return {
    props: {
      posts: posts.data.posts.nodes,
    },
    revalidate: 1,
  };
 }

Instead it queries all posts, the original including translated posts. I might be missing something here?

In Next.js I've setup i18n in the config file and works as expected.
http://localhost:3000/ and http://localhost:3000/en works as expected except the posts.

GraphQL IDE stops working when this plugin is active

Hi, I have installed this plugin yesterday, and whenever this plugin is active, /wp-admin/admin.php?page=graphiql-ide stops showing the schema. I get the 'NO SCHEMA AVAILABLE' screen and these are some of the relevant errors:

XHR Call (on the inspector): /index.php?graphql
Response: {"code":"internal_server_error","message":"

There has been a critical error on this website. Please check your site admin email inbox for instructions.</p>

<a href="https://wordpress.org/support/article/faq-troubleshooting/">Learn more about troubleshooting WordPress.</a></p>","data":{"status":500},"additional_errors":[]}

Console:
devAssert.mjs:5 Uncaught (in promise) Error: Invalid or incomplete introspection result. Ensure that you are passing "data" property of introspection response and no "errors" was returned alongside: { status: 500 }.
at r (devAssert.mjs:5)
at m (buildClientSchema.mjs:27)
at App.js:181

Does anyone know how to solve this?

ACF Taxonomy field does not return translated terms

I have a homepage which has a pageHome ACF group. This group has an ACF group field called productCategories in the schema. This group field has a Taxonomy field, also called productCategories inside. The Taxonomy field correctly saves the translated Term IDs in the database, but when fetching the translated version of the homepage, both the original (Dutch) version and the translated (English) versions return Dutch taxonomy terms.

The below query is an example that should return the Dutch homepage and the English homepage, with taxonomy terms with different database IDs attached to each version.

query TestPageHome {
  page(id: "/", idType: URI) {
    ...PageHome
    translated {
      ...PageHome
    }
  }
}

fragment PageHome on Page {
  locale {
    locale
  }
  pageHome {
    productCategories {
      productCategories {
        databaseId
      }
    }
  }
}

{
  "data": {
    "page": {
      "locale": {
        "locale": "nl_NL"
      },
      "pageHome": {
        "productCategories": {
          "productCategories": [
            {
              "databaseId": 40
            },
            {
              "databaseId": 38
            },
            {
              "databaseId": 39
            }
          ]
        }
      },
      "translated": [
        {
          "locale": {
            "locale": "en_US"
          },
          "pageHome": {
            "productCategories": {
              "productCategories": [
                {
                  "databaseId": 40
                },
                {
                  "databaseId": 38
                },
                {
                  "databaseId": 39
                }
              ]
            }
          }
        }
      ]
    }
  }
}

Relevant plugins:

Plugin name	Version
WPGraphQL	1.14
WPGraphQL for ACF	0.6.1
WPGraphQL WPML	1.1.0
ACFML	2.0.3
WPML CMS	4.6.0
WPML String Translation	3.2.4

define ('WP_ADMIN', TRUE) ??

I think this is a bad solution and breaks a lot of stuff, like addToCart mutation of WooGraphQL plugin. The problem is on WPML (class-wpml-query-parser.php)

if ( /* $this->sitepress->get_wp_api()->is_admin()
		&& */ ! $this->sitepress->get_wp_api()->constant( 'DOING_AJAX' )
	) {
		return $q;
	}

as you see I have commented out the ->is_admin() which is also a bad idea since this function is a core function of WPML but gets my job done (ex querying products with graphql/lang=my_lang_code) and also not breaking addToCart mutation. No need to define WP_admin since it changes a lot of functionality as every plugin has a is_admin() call and also it might introduce security vulnerabilities.

Impossible to fetch menuItems by locale

Querying Options Pages

Is it possible to query option pages (created with ACF) in different languages?

Classic WPML editor causes non-HTML fields

This plugin has been really awesome so far! :)

I was using the classic editor and noticed a little bug.

Repro steps

1. Go to an english page and make a translation using the classic editor
   For instance, I went into an english page and added an es-mx translation

2. Feel free to make a new page but using the new editor where you get an entire page
   For instance, this is my french page
   

3. Go into GraphiQL and run a page query, notice the page translated with the classic editor has a bunch of carriage returns and is not wrapped in an html element:
   

Versions

WP GraphQL: v1.0.5
WPGraphQL WPML: v0.0.1
WP version : v5.6
Gutenberg: v9.7.2
WPGraphQL Custom Post Type UI: v1.1
WPGraphQL for Advanced Custom Fields: v0.3.4
WP Gatsby: v0.9.1

Fetch menus return multiple times the same item

Hi, first thanks for your great plugin!

I have an issue trying to retrieve all my menus setup in wordpress. I have three locales defined on my website (EN,FR,DE) and one menu translated in each language.
Each translated menu has a different name (ex: Root menu, Root menu - French) but when I make a query for the menus the response is always three times the English menu.

Do you know what could cause this?

Looking up a node by nodeByUri for a translated permalink

We have hit an issue where some of our custom post types have translated permalinks/slugs, an example query is below, the URI being passed is the relative path on the current page (i.e ///).

Example that works (non-translated):

• /pagetype/pageslug

Examples that do not work:

• /pagetypetranslated/pageslugtranslated
• /locale/pagetypetranslated/pageslugtranslated
• https://example.com/locale/pagetypetranslated/pageslugtranslated
• pageslugtranslated
• etc

It's as if the WPGraphQL plugin is not aware of any translated URIs on any custom post types. It DOES work for translated page URIs but not for any custom post types.

I've looked through open issues but can't see anything that stands out currently but possibly some related issues - does anyone have any clever ideas of how we can query these pages? We're using FaustJS and it has a seed query which it uses to resolve the correct template and appropriate document ID for the given URI so at present this is a bit of a blocker!

GraphQL to reproduce (pass in a URI):

query MyQuery($uri: String!) {
  node: nodeByUri(uri: $uri) {
    ...NodeByUri
  }
}

fragment NodeByUri on UniformResourceIdentifiable {
  __typename
  uri
  id
}

multi-currency

Hi, does anynone know how to get or register currency fields from the WPML multi-currency plugin?
thanks!

Translated Sub-categories returning null from nodeByUri

First of all, thank you for making this plugin. It has proved incredibly useful so far and I appreciate the time that you have spent on this. I am currently working on a site that uses both WPGQL and WPML. We have translated categories for users to search through our site a little easier but I have found some strange behavior and I cant exactly tell where the issue is. The gist:

The GraphQL operation nodeByUri works on some cases but not all URIs. Please note that
actualites is tech-news in French and failles-de-donnees-et-alertes is breaches-and-alerts in French.

✅ category/tech-news
✅ category/actualites
✅ category/tech-news/breaches-and-alerts
✅ category/tech-news/failles-de-donnees-et-alertes/
❌ category/actualites/breaches-and-alerts
❌ category/actualites/failles-de-donnees-et-alertes/

The query looks like this and returns the english URI

query GetURIS($uri: String = "URL_GOES_HERE") {
  nodeByUri(uri: $uri) {
    uri
  }
}

Its strange to me that /actualites would work but with more subpaths, the query seems to break. It finds the correct information when the subpath is english or when the subpath is translated but not two levels deep. I am unsure if this is a problem with this plugin, WPGQL, WPML, or even WPML config. The actualites is definitely translated in WPML since the query works with just /actualites, it seems like there is just an issue with multiple subpaths being translated. Its also strange because I can go to

Its also a little strange because I can go to MY_SITE.com/category/actualites/failles-de-donnees-et-alertes/ and it will redirect me to the english version which means that on some level the site knows the translations for the URL.

What are your thoughts on this potentially being an issue with this plugin? Or a problem with WPGQL or WPML?

Have not found a way to fetch Posts or Post by `locale`

Thank you to anyone who can help with this. Maybe my approach is wrong and you can tell me how you are getting the results I'm looking for.

fragment AuthorFields on User {
  name
  firstName
  lastName
  avatar {
    url
  }
}

fragment PostFields on Post {
  title
  excerpt
  slug
  date
  featuredImage {
    node {
      sourceUrl
    }
  }
  author {
    node {
      ...AuthorFields
    }
  }
  categories {
    edges {
      node {
        name
      }
    }
  }
  tags {
    edges {
      node {
        name
      }
    }
  }
}

fragment AdditionalFields on Post {
  content
  locale {
    locale
  }
  translations {
    post_title
    locale
    href
  }
  seo {
    metaDesc
    metaKeywords
    metaRobotsNofollow
    metaRobotsNoindex
    opengraphAuthor
    opengraphDescription
    focuskw
    cornerstone
    canonical
    breadcrumbs {
      text
      url
    }
    opengraphImage {
      altText
      link
      uri
      title
      sourceUrl
    }
    opengraphModifiedTime
    opengraphPublishedTime
    opengraphPublisher
    opengraphSiteName
    opengraphTitle
    opengraphType
    opengraphUrl
    title
    twitterDescription
    twitterTitle
    twitterImage {
      altText
      caption
      uri
      sourceUrl
    }
  }
}

query PostBySlug($id: ID!, $idType: PostIdType!) {
  post(id: $id, idType: $idType) {
    ...PostFields
    ...AdditionalFields
  }
}

query AllPosts($length: Int!, $after: String) {
  posts(first: $length, after: $after, where: {orderby: {field: DATE, order: DESC}}) {
    edges {
      node {
        title
        excerpt
        slug
        date
        featuredImage {
          node {
            sourceUrl
          }
        }
        author {
          node {
            name
            firstName
            lastName
            avatar {
              url
            }
          }
        }
      }
      cursor
    }
    pageInfo {
      hasNextPage
      hasPreviousPage
      startCursor
    }
  }
}

Translation for isPostsPage is set to false

When I'm making a query to get the posts page, translated page return false for value isPostsPage.

Reading settings is configured on the good page.

Query :

{
  pages(where: {name: "blog"}) {
    nodes {
      uri
      isPostsPage
    }
  }
}

Result

{
"data": {
    "pages": {
      "nodes": [
        {
          "uri": "/blog/",
          "isPostsPage": true
        },
        {
          "uri": "/fr/blog/",
          "isPostsPage": false
        }
      ]
    }
  }
}

List all posts (in all languages)?

I have installed your plugin, but when I query posts it still only shows the posts in the default language.

How do I query all posts (regardless of language)?

Locale field on Product Type (woograpql) ?

Hi.

is it possible to extend locale field to Product Type, at the moment this is only visible in Post Types.

Translated categories aren't showing in Graphql

I can't see the translated categories in the GraphQL. The below only shows the 3 categories in the default language - and not the translated categories.

Similar issue happened with my menus - if you go into a translated menu and then save it, it will then remove all translated menus from the graphql.

query MyQuery {
terms(where: {taxonomies: CATEGORY}) {
edges {
node {
id
link
name
... on Category {
id
name
}
taxonomyName
uri
}
}
}
}

Fetch last posts return 3 times the same posts

Hi,

I am using the last version of WPML and wordpress 5.6.1.

When I query the posts I get all the post but the translated post are also part of the request. For exemple if the last post is translated in two other languages I get 3 times the same post, one for each language.

The posts and the translations don't have the same post id so I suppose this is why I get them but is this an expected behavior or do I miss something to only query one language at the time?

post() and postBy() queries return null in non-default language after WPGraphQL v1.14.0

Hello,

After upgrading to WPGraphQL v1.14.0, all single post queries in the non-default language (English) now return null.

Example:

{
  post(
    id: "les-bases-de-la-guitare-la-guitare-basse"
    idType: SLUG
  ) {
    id
  }
}

Returns:

{"data": {
    "post": null
  },}

posts() queries using { where: { wpmlLanguage: $LANG } } still behaves as expected - returning posts in only the specified language:

{
  posts(first: 10, where: {wpmlLanguage: "fr"}) {
    edges {
      node {
        id
      }
    }
  }
}

Returns:

{
  "data": {
    "posts": {
      "edges": [
        {
          "node": {
            "id": "cG9zdDoxMTg0Nzk="
          }
        },
        {
          "node": {
            "id": "cG9zdDoxMTg1NDE="
          }
        },...

Any idea what might be happening here?

Best,

Matt

Woocommerce products can not be queried in another language

The following query should return the english versions of the products. Instead it returns the main locale (german in this case):
Query
{ products(where: {wpmlLanguage: "en"}) { nodes { id slug name ... on SimpleProduct { id name buecherFields { buchKategorien { nodes { name slug } } } buchInfos { buchInfos } locale { locale id } } } } }

Response

{
  "data": {
    "products": {
      "nodes": [
        {
          "id": "cHJvZHVjdDoxMDE4Mg==",
          "slug": "sollberger-boegli",
          "name": "Sollberger Bögli",
          "buecherFields": {
            "buchKategorien": {
              "nodes": [
                {
                  "name": "De aedibus",
                  "slug": "de-aedibus"
                }
              ]
            }
          },
          "buchInfos": {
            "buchInfos": "<p>Herausgegeben von: Heinz Wirz<br />\nTextbeitrag: Katharina Marchal</p>\n"
          },
          "locale": {
            "locale": "de_DE",
            "id": "de_DE"
          }
        },
....

Cursor pagination showing duplicate posts when using where{search} with after

Hello,

My team has noticed the following:

A query using where {search: } will show the same posts on multiple pages when using after: endCursor. Typically the first 3-6 posts of the search results are the same on every page, but results further down the page do change from page-to-page. I was able to duplicate the behavior in the GraphQL IDE. Disabling WPML causes the search query to work correctly.

We're looking into possible solutions, but I thought I would bring it up here as well. I'll let you know if I find anything out.

Best,

Matt

Does this extension support GraphQL mutation in specific language?

Hi there

Thanks for creating this amazing extension.

I am actually working on a project, and I would like to create posts in specific languages using GraphQL mutation. I just could not find that option anywhere in the schema while sending the mutation.

Does this extension actually support mutation? if yes, pls guide me how, if not, Would you consider that in a future update?

thanks in advance.