shopifygatsbylanguage-translationgatsby-pluginshopify-storefront-api

React-Shopify Translations | How to get products in a second language from Shopify

I'm trying to get products in the second language from Shopify store.

The Storefront API states that the HTTP request header must contain Accept-Language: de, in my case (in React), the settings should look like this: https://shopify.dev/tutorials/manage-app-translations-with-admin-api#storefront-api-translation-header

const clientWithTranslatedContent = Client.buildClient({
  domain: 'your-shop-name.myshopify.com',
  storefrontAccessToken: 'your-storefront-access-token',
  language: 'de' // Accept-Language
});

How it have to work you can find here: https://github.com/Shopify/js-buy-sdk/blob/update-language-setting/src/client.js

I'm using Shopify Webhook API version 2020-07 (Latest). Here gatsbyjs/gatsby#24173 (comment) I found information that in version 2020-04 Accept-Language header supports translations, but it doesn't work in my case.

In building an application, I always receive goods with default translation (EN).

Solution

  • The problem was caused by the "gatsby-source-shopify" plugin that generates pages in gatsby-node.js. It doesn't take into account Accept-Language in the header of HTTP requests. To solve the problem, my team has finalized this plugin.

    Here's a link: https://github.com/alex-borodin-vtlabs/gatsby-source-shopify-translated