דלג על ניווט
2

We're excited to announce the release of WPML GraphQL, a new glue plugin that bridges WPML and WPGraphQL, enabling multilingual support within the GraphQL schema.

Designed for developers using Gatsby, React, Vue, and other popular front-end technologies, WPML GraphQL is the optimal solution for creating headless WordPress websites in multiple languages.

What is Headless WordPress?

In simple terms, "headless WordPress”, refers to a setup where WordPress works behind the scenes while you employ a separate technology for the front-end. 

Sometimes, you need to build a completely custom front-end application without the need to follow the WordPress template and URL hierarchy. In other words, you don't want to be restricted by how WordPress themes work, you want to build your own front-end.

However, you can still use WordPress for all your content creation and editing needs.

Now, all you need is a way to easily deliver data from the WordPress backend to whatever front-end technology you're using. This is where WPGraphQL comes in. It allows you to selectively retrieve the exact content element you need for each part of your front-end.

Finally, WPML GraphQL is the magic ingredient that lets you get language data and translations from the WPML plugin. This enables you to build a customized, headless WordPress site that is multilingual.

Recommended Development Stack for Building Headless WordPress Sites

Front-end

Gatsby

Front-end framework for building the user-facing application or site

Gatsby Add-on for WordPress

gatsby-source-wordpress add-on allows Gatsby to get data from your WordPress backend

Back-end

WordPress

For all your content management needs, you only use the backend

WPGraphQL plugin for WordPress

Adds GraphQL support to WordPress

WPML GraphQL plugin for WordPress

Enables multilingual features within the GraphQL schema

WPGatsby plugin for WordPress

Optional, but depending on your needs might come in handy

Enhanced Capabilities with WPML GraphQL

WPML GraphQL integrates with WPGraphQL and adds new fields and filters to the GraphQL schema. After installing the plugin, you can navigate to GraphQL → GraphQL IDE and use the Query Composer to query and filter content in multiple languages.

In the screenshot below, you can see how easy it is to use the language field to retrieve a list of all posts on a WordPress site, including their language code, slug, and URI. You can also use the translations field to get similar information for the translations of each post:

Using the language and translations fields in the Query Composer to retrieve posts in multiple languages

This integration between WPML GraphQL and WPGraphQL opens a world of multilingual possibilities:

  • Build headless multilingual WordPress sites
  • Use new fields (language, language code, translations) to retrieve specific language data and translations from the WPML plugin
  • Filter post types, taxonomies, and comments by language
  • Get language data for objects and nodes
  • Query data based on all installed languages or specific languages

As a bonus, WPML GraphQL plays well with ACF, ACF Multilingual, and WPGraphQL for Advanced Custom Fields. This allows you to easily interact with multilingual data coming from ACF fields.

For more about how multilingual functionality can elevate WPGraphQL, check out the page dedicated to WPML GraphQL.

Download and Install

You can find the WPML GraphQL plugin on the WPML Downloads page

Or from your site’s admin, you can go to Plugins → Add new and click over to the Commercial tab.

Downloading WPML GraphQL from the Commercial tab on the Plugins page

Share Your Thoughts

Are you currently using WPGraphQL for your web development? Do you plan to create a headless WordPress site with multilingual functionality? We'd love to hear your thoughts! 

Share your feedback and tell us how you plan to use the WPML GraphQL plugin in the comments below.

How can we make WPML better for you?

Share your thoughts and comments about our plugin, documentation, or videos by booking a Zoom call with Agnes, our Client Advocate. Your feedback matters and helps us improve.

Book a call with Agnes