gatsby-source-shopify | Get actual product ID and SEO Data

[code-mat]

Description

Hi folks. I'm just wondering if there's any way to get an actual product ID from Shopify and its seo data (title and description fields). I really need to get somehow real products IDs to implement third-party library which is based on them. I use gatsby-source-shopify and my queries return ids with weird prefixes, while accessing to seo data is not possible at all. Here's how it looks like:

Expected result

I'd like to query by product ids and seo fields (graphql from shopify admin allows for that):

Thanks in advance!

[tonyhans7]

Bumped into the same issue, saw that articles could retrieve SEO meta title & description, but not the product? Is there way to retrieve the SEO data?

[code-mat]

so yes, it's weird that only articles contain the SEO data by default. but as @LekoArts suggested you can edit your settings for queries in gatsby-config.js:

 {
  resolve: 'gatsby-source-shopify',
  options: {
    shopName: 'keynutrients',
    accessToken: process.env.SHOPIFY_ACCESS_TOKEN,
    apiVersion: '2021-01',
    includeCollections: ['shop', 'content'],
    shopifyQueries: {
      products: `
        query GetProducts($first: Int!, $after: String) {
        products(first: $first, after: $after) {
        pageInfo {
          hasNextPage
        }
        edges {
          cursor
          node {
            availableForSale
            createdAt
            description
            descriptionHtml
            handle
            id
            seo {
              title
              description
            }
          }
        }
      }
    }
  }
}

and SEO data are visible for products 🤞

[tonyhans7]

Thanks. It is working great for me.

[wutangpaul]

@wphowto @code-mat What version of gatsby-source-shopify did you guys use for that? I have tried 4.7.1 without success and the latest 5.x

[LekoArts]

The ShopifyId is the Storefront ID, the id is Gatsby's internal ID. The source plugin uses the Storefront API, your screenshot is from the admin API afaik. You'll need to check if the Storefront API supports those queries, if yes, you can change the default queries: https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-source-shopify#how-to-use

See defaultQueries option.

[code-mat]

@LekoArts Thanks for the reply. So I customized a bit shopifyQueries in gatsby-config and i've added seo tags (it's working!) But I don't see any way to get an actual product id 😞

[amandasaffer]

You may find this thread helpful in retrieving product and variant numerical IDs: https://community.shopify.com/c/Shopify-APIs-SDKs/Product-ID-in-Admin-API-vs-Product-ID-in-GraphQL/td-p/404780

[react-hunter]

@code-mat
I've added shopifyQueries for article in gatsby-config. btw, in page component, how to use it?
would you please put any example code here?
Thanks