8.SIMILAR

Fetch similar products for a given product identifier.

What we want to build

We want to show a slider with up to 8 similar products on our product page.

GraphQL query and response - id only

To ensure that you show the most recent data in you shop you should only query the product ids and fetch the rest of the data you need for your UI from your own database.

GraphQL query

query {
  product(id: "8S-DEMO-Polohemd-1") {
    similarProducts(first: 8) {
      edges {
        node {
          id
        }
      }
    }
  }
}

cURL request

response

GraphQL query and response - full data

In case you can not make the extra roundtrip you can actually query all the data that is required to render a basic UI.

GraphQL query

```groovy
query {
  product(id: "8S-DEMO-Polohemd-1") {
    similarProducts(first: 5) {
      edges {
        node {
          id
          brand
          images {
            edges {
              node {
                url
              }
            }
          }
          modelId
          name
          tags
          url          
          variants {
            edges {
              node {
                id
                variantId
                manufacturerSuggestedRetailPrice {
                  amount
                  currencyCode
                }
                price {
                  amount
                  currencyCode
                }
                
              }
            }
          }
        }
      }
    }
  }
}
```

cURL request

response