Wait is your issue that Instagram in app browser is not rendering the site

I mean can you upload relevant screenshots

Of the exact behaviour

@Brown bear I am getting 404 for the rest of the site except for headers - also the footer which doesn’t have js is not loading

you pinged the wrong person

Oh I see the issue

Can you just try running the app locally

then open the localhost url from instagram browser

and you can prob debug from consol

also try checking your netlify blog once

The thing is I don't see a way to change the url on in-app browser 🤔 @Anay-208

You can create a alt account and add the link to bio

@Anay-208 I tried but how would it help me change the url? It doesn’t work inside in-app Instagram browser

@European sprat I’ve seen this issue before — it’s usually NOT Netlify, but the Instagram in-app browser itself.

Instagram’s browser is limited and often breaks:

JS execution

CSS rendering

Next.js hydration

Lazy loading (especially next/image)


Common causes:

Hydration mismatch (SSR vs client)

next/image (IntersectionObserver issues)

Third-party scripts (analytics, pixels)

Complex CSS (100vh, fixed elements)


Things you can try:

1. Test without next/image

<img src="/image.png" />

If it works → image optimization is the issue.


2. Disable scripts temporarily Remove analytics / external scripts and test again.


3. Reduce hydration complexity If using dynamic content:

dynamic(() => import("./Component"), { ssr: false })


4. Check viewport

<meta name="viewport" content="width=device-width, initial-scale=1" />


Most reliable fix (used in production):

Force open in external browser:

if (navigator.userAgent.includes("Instagram")) {
window.location.href = "googlechrome://" + window.location.href;
}


Reality:

Many production sites don’t fully support IG browser. They either:

degrade gracefully

or force external browser

https://www.qaplo.com

Thanks! I will then try with redirection to the external browser.

They gave you an AI message. I don’t think it’s going to help.