Conversation
How to use the Graphite Merge QueueAdd the label graphite: merge to this PR to add it to the merge queue. You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has enabled the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. |
There was a problem hiding this comment.
Pull Request Overview
This pull request adds dynamic Open Graph (OG) image generation for documentation pages using the sharp library. The implementation automatically generates unique OG images for each markdown page based on the page title.
Key Changes:
- Added
sharppackage (v0.34.5) for image processing - Created an SVG template for OG images with dynamic title placeholders
- Implemented automatic OG image generation during build using VitePress's
transformPageDatahook - Added generated OG images directory to
.gitignore
Reviewed Changes
Copilot reviewed 2 out of 5 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| pnpm-lock.yaml | Added sharp@0.34.5 dependency and its platform-specific binaries; removed libc fields from various package entries |
| docs/package.json | Added sharp as a dev dependency |
| docs/.vitepress/og-template.svg | New SVG template for OG images with placeholders for dynamic title lines |
| docs/.vitepress/config.ts | Implemented addImage and genOg functions to generate OG images for each page; added transformPageData hook to process pages |
| .gitignore | Added docs/public/og to ignore generated OG images |
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull Request Overview
Copilot reviewed 2 out of 5 changed files in this pull request and generated 5 comments.
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
2e86304 to
ecd6796
Compare
|
I'm now using a plugin, based on this tweet from Evan You. |
|
Wow this is really cool. Just a heads up that we're doing a rebranding that should be released in the next few weeks. The SVG logo will need to be updated then. Are we able to customize the font? |
|
@mdong1909 This should be possible through a custom og image template |
|
Yes, font can be customized. I'm using Figma to create and edit the SVG. I will add a dedicated section in the plugin documentation. If needed, I can help create the new OG based on the upcoming rebranding. |
Hello 👋,
I recently shared a link on X and I saw that the OG wasn't related to the page. So it doesn't make you want to click.
To fix this, OG images are dynamically generated based on the page title. The homepage keeps the current OG images. If needed, I can change the template. I tried to have something related to the current one. Let me know!