Configuring Preview Environments in Vercel

Please fill out as many of the following questions as possible so we can help you promptly! If you don’t know how to answer or it does not apply, feel free to remove it or leave it blank.

Builder content link

Builder public api key
a351bba0694846ec8a75c05e9fefbc69

What are you trying to accomplish
I am trying to set up a preview environment in vercel where content editors can edit content and see the “Open in Builder” links when Navigating the site. I have created another domain for this: https://p-jhs-mavda.vercel.app/ and have made that my preview url for both the site and the Page model. When I click to preview the page from builder this url opens but you don’t see the blue hover states with the Open in Builder links. I am sure I am missing some small configuration so looking for some guidance on how to properly configure this.

Screenshots or video link
Here is a video of what I have done:
Recording-20240516_091147.webm

Code stack you are integrating Builder with
NextJS

Hello @jhs129,

The “Open in Builder” links are a feature of our dev tool. However, it appears that this feature may not work on production sites because the browser won’t be able to differentiate between a Builder user and a regular visitor previewing the website. Therefore, we recommend using our Chrome extension, which offers the same functionality and works for live production pages.

You can download the Chrome extension from the following link: