# Product not been display on the page

**URL:** <https://forum.builder.io/t/product-not-been-display-on-the-page/5216>\
**Category:** Shopify\
**Created:** [March 26, 2024, 3:35am UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216 "2024-03-26T03:35:00Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 26, 2024, 3:35am UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/1 "2024-03-26T03:35:00Z")

</div>

Hey @manish-sharma,

I hope you are having an amazing week so far. I’m having a hard time figuring out why my Shopify product is not importing the data that I have on Shopify but has not been imported on the page correctly.

https://www.loom.com/embed/2718026c136a4ac195191598e70de7d3  
https://www.loom.com/embed/8ed1f0ab659c4228ab8fd73719647810?sid=e815e63d-cd96-4893-afbf-7f4ed3d62302

---

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [March 26, 2024, 10:21am UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/2 "2024-03-26T10:21:00Z")

</div>

Hello @xbrandonpowell,

I’ve been doing well, and I hope you had a pleasant weekend too.

It seems there might be an issue with your integration. Would you mind sharing the relevant code with us? I noticed that you’re attempting to create a page with the path [http://localhost/eyeglass/hydrogen](http://localhost/eyeglass/hydrogen). Is this path integrated into your codebase?

Your cooperation in providing this information will help us better understand and address the issue you’re encountering.

Looking forward to your response.

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 26, 2024, 11:30am UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/3 "2024-03-26T11:30:24Z")

</div>

Good Morning @manish-sharma,

I had a relaxing weekend and learning how to take breaks when comes to coding projects but still pushing on figure out [builder.io](http://builder.io) below I have posted a video on what you want me to do and figure out.

Being a one-person developer is not easy for all of us but we keep on pushing through the fight to finish what must done and complete it so the next person can understand what needs to be done.

Here the video:

https://www.loom.com/embed/4de1f95a24b04aae972718c48c7bfdfa?sid=fbb84398-230e-490d-bae0-995b469b252e

So the path has to be relevant within the code I did not know that because I was lost and confused in what was the on how to go about make page I was looking on the website on how correctly do this on my page but could never find out the solution so that why comeback to you.

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 26, 2024, 2:23pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/4 "2024-03-26T14:23:15Z")

</div>

On this screenshot this how the path is be import in the code:

 ![Screenshot 2024-03-26 at 10.22.16 AM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/5/5e979d453feaef892e524eaf0f4a0f602f983166.jpeg)

@manish-sharma

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 26, 2024, 2:26pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/5 "2024-03-26T14:26:54Z")

</div>

this code have review work within ChatGTP so now has change the path name will see if this will work within the code:

```auto
import type {
  GetStaticPathsContext,
  GetStaticPropsContext,
  InferGetStaticPropsType,
} from 'next'
import { useRouter } from 'next/router'
import { BuilderComponent, builder, useIsPreviewing } from '@builder.io/react'
import { resolveBuilderContent } from '@lib/resolve-builder-content'
import builderConfig from '@config/builder'
import shopifyConfig from '@config/shopify'
import {
  getCollection,
  getAllCollectionPaths,
} from '@lib/shopify/storefront-data-hooks/src/api/operations'
import DefaultErrorPage from 'next/error'
import Head from 'next/head'
import { useThemeUI } from '@theme-ui/core'
import { getLayoutProps } from '@lib/get-layout-props'

builder.init(builderConfig.apiKey!)
const builderModel = 'collection-page'

export async function getStaticProps({
  params,
  locale,
}: GetStaticPropsContext<{ handle: string }>) {
  const collection = await getCollection(shopifyConfig, {
    handle: params?.handle,
  })

  const page = await resolveBuilderContent(builderModel, locale, {
    collectionHandle: params?.handle,
  })

  return {
    notFound: !collection,
    revalidate: 30,
    props: {
      page: page,
      collection: collection,
      ...(await getLayoutProps()),
    },
  }
}

export async function getStaticPaths({ locales }: GetStaticPathsContext) {
  const paths = await getAllCollectionPaths(shopifyConfig)
  const modifiedPaths = paths.flatMap((path) => [
    `/collection/eyewear/${path}`,
    `/collection/sunglass/${path}`,
  ])

  return {
    paths: modifiedPaths,
    fallback: 'blocking',
  }
}

export default function Handle({
  collection,
  page,
}: InferGetStaticPropsType<typeof getStaticProps>) {
  const router = useRouter()
  const isPreviewing = useIsPreviewing()
  const isLive = !isPreviewing
  const { theme } = useThemeUI()
  if (!collection && isLive) {
    return (
      <>
        <Head>
          <meta name="robots" content="noindex" />
          <meta name="title"></meta>
        </Head>
        <DefaultErrorPage statusCode={404} />
      </>
    )
  }

  return router.isFallback && isLive ? (
    <h1>Loading...</h1>
  ) : (
    <BuilderComponent
      key={collection.id}
      options={{ enrich: true }}
      model={builderModel}
      data={{ collection, theme }}
      content={page}
    />
  )
}

```

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 26, 2024, 5:47pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/6 "2024-03-26T17:47:08Z")

</div>

As I was using my helpful to help better understand and figure out this error we getting within our console.log:

`3eyeglasses:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received`

- How can I learn to Isolate Issues better in reading code?
- What type of way can understand, and read this console.log?

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 26, 2024, 7:10pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/7 "2024-03-26T19:10:37Z")

</div>

This are the collection I have created for the pages from the eyeglasses to sunglasses to bestselling style this all that we have created so far:

 ![Screenshot 2024-03-26 at 3.08.59 PM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/3/3686321d2c7ec0137b95141d34556ae693de8048.jpeg)

---

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [March 27, 2024, 11:30am UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/8 "2024-03-27T11:30:45Z")

</div>

Hello @xbrandonpowell,

We’ve looked into the issue you reported. Could you please check the error message displayed in your browser’s console? It seems there’s a 401 Unauthorized error occurring when attempting to access the collection data at [https://beta-sbr.myshopify.com/api/2023-10/graphql](https://beta-sbr.myshopify.com/api/2023-10/graphql). This error typically indicates an authentication problem. I’ve recorded a loom demonstrating the issue that you can refer to at the below link

https://www.loom.com/embed/c6da51b324604100b313bb61664a1efc?sid=4af692d8-f353-48ec-ab01-a51339f029ce

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 27, 2024, 4:42pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/9 "2024-03-27T16:42:27Z")

</div>

I have followed what you teach to do @manish-sharma So I have version 2023 - 10 on there already my question is:

1. What is the command again to open the inspect element at [builder.io](http://builder.io)?

A will still get the object Object error message. But here the video:

https://www.loom.com/embed/ab91538dd40c4d28abf00308a493605c?sid=69d3e9d4-a75a-4155-908e-c054a65eab5b

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 28, 2024, 4:53pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/10 "2024-03-28T16:53:16Z")

</div>

Just check in @manish-sharma to see if did everything correctly. In the one that you told me to do hopefully, that the correct version.

---

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [March 28, 2024, 4:59pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/11 "2024-03-28T16:59:46Z")

</div>

Hello @xbrandonpowell,

I was able to reproduce the issue you are experiencing, and currently working on figuring out a possible solution. I’ll update you as soon as I make any progress.

Thank you!

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 28, 2024, 5:13pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/12 "2024-03-28T17:13:34Z")

</div>

Hello @manish-sharma well have an amazing weekend and look forward to learning what solve that you find out for me to learn from.

Thank you so much,  
Brandon Powell

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [March 29, 2024, 8:49pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/13 "2024-03-29T20:49:23Z")

</div>

Hey @manish-sharma just want to let know updated the version to latest still did not do anything here the screenshot:

 ![Screenshot 2024-03-29 at 4.46.17 PM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/5/53dc967dbeb8ce13a444e47460921645a2ace2dd.png)

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [April 1, 2024, 6:41pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/14 "2024-04-01T18:41:29Z")

</div>

Happy Monday @manish-sharma just checkin to see if you had any success with shopify an the issues was having with the products.

Not show up on the page. Have you came across a solution that could work with this issues, please and thank you for your help.

---

<div class="post-metadata">

**Author:** ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)\
**Post date:** [April 2, 2024, 12:55pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/15 "2024-04-02T12:55:09Z")

</div>

Hello @xbrandonpowell,

Could you try updating the “shopify-buy” plugin to the latest version and see if that helps resolve the issue?

To update “shopify-buy” to latest version you can use the below npm command

```auto
npm install shopify-buy@latest
npm install @types/shopify-buy@latest

```

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [April 4, 2024, 3:13pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/16 "2024-04-04T15:13:21Z")

</div>

Hey @manish-sharma,

I think the issue could with **BuilderIO** because as I can see when go to the dropdown to pick the collection within the Builder I can see the all my collection that all posted in Shopify in there but all my products.

Are not showing up within the downtown do you have any suggestion that I can do because tried every suggestion that GPT has suggest me to do.

But still no success with that having product to load on the pages.

Thank you,  
Brandon Powell

---

<div class="post-metadata">

**Author:** ![xbrandonpowell](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.builder.io/xbrandonpowell/32/3146_2.png) [@xbrandonpowell](https://forum.builder.io/u/xbrandonpowell)\
**Post date:** [April 19, 2024, 1:43pm UTC](https://forum.builder.io/t/product-not-been-display-on-the-page/5216/17 "2024-04-19T13:43:09Z")

</div>

The issues was solved isses was I had to updated the all my .env files with the correct Shopify API and Key from there we have solved this issues now.