<meta property="og:title" content="og:title content">
<meta property="og:description" content="og:description content">
<meta property="og:image" content="https://beta.vero.site/preview-og-image.png">
<!-- optional: ??? -->
<meta name="twitter:card" content="summary">
<!-- on Discord, the left border will be this color: -->
<meta name="theme-color" content="#984a0b" />
<!-- slightly less common -->
<meta property="og:site_name" content="og:site_name content">
<meta property="og:locale" content="en_US">
<meta property="article:author" content="article:author content">
These are just the ones I typically use to get previews. This one just has summary
instead of summary_large_image
. See htmlhead.dev for more.
From testing, a path without the site like /preview-og-image.png
seems to work on, e.g., Discord, but not Twitter.
I think your og:image should probably be square? I dunno.