🍇Open Graph Image Generator based on @vercel/og for personal use.
Have you ever posted a hyperlink to Twitter, Facebook, or Slack and seen an image popup?
How did your social network know how to "unfurl" the URL and get an image?
The answer is in your <head>.
The Open Graph protocol says you can put a <meta> tag in the <head> of a webpage to define this image.
It looks like the following:
<head>
<title>Title</title>
<meta property="og:image" content="http://example.com/logo.jpg" />
</head>- Feel free to customize an image for every single blog post or every single documentation page.
- This is easily introduced through a link with some params.
- Fork this repository
- Replace the bg image and logo to yours in pulic dir, and change the relevant text infomation.
- Connect Vercel for GitHub to automatically deploy each time you
git push - Add the following to the vercel environment variables: Settings > Environment Variables
| Name | Value |
|---|---|
| NEXT_PUBLIC_DEPLOYMENT_URL | https://deployment.domain.com |
MIT License © 2023 Lovell Liu