### Issue
If you try to use my GitHub page:
- ✅ Works fine → https://aliscie2.github.io/oDoc/ (thumbnail shows)
- ❌ On mainnet → https://icpjobs.com/ (thumbnail not showing)
---
### `index.ts`
```tsx
<Helmet>
{["twitter:image", "og:image"].map((property: string) => {
const basePath =
import.meta.env.VITE_DFX_NETWORK === "staging" ? "/oDoc/" : "/";
const imageName = window.location.hostname.includes("icpjobs")
? "icpjobs_thumnail.png"
: "odoc_thumnail.png";
return (
<meta
key={property}
property={property}
content={`${basePath}${imageName}`}
/>
);
})}
</Helmet>
index.html
<meta key="og:image" property="og:image" content="/public/icpjobs_thumnail.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:site_name" content="ODOC" />
<!-- Twitter -->
<meta key="twitter:image" property="og:image" content="/public/icpjobs_thumnail.png" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:url" content="https://icpjobs.com" />
<meta name="twitter:title" content="ICPJOBS | AI job match | Crypto Agreements" />
Repo
GitHub: oDoc
Already Tried
-
Changed from:
content="/public/icpjobs_thumnail.png" -
To:
content="/icpjobs_thumnail.png" -
Still not working on mainnet.
