feat: Dynamic og image #1344 #1616
Conversation
Revert "Update [...path].png.ts" This reverts commit 9d7329d.
break down logic in dyanmic [...]png, utils., templates. added path to /blog Templates based on figma design exported svg
this is needed because /blog don't have a corresponding .md or mdx file
added ts config reference to assets
Revert "Update [...path].png.ts" This reverts commit 9d7329d.
break down logic in dyanmic [...]png, utils., templates. added path to /blog Templates based on figma design exported svg
this is needed because /blog don't have a corresponding .md or mdx file
added ts config reference to assets
…i-docs into dynamic-og-images
head social image with better social image logic
✅ Deploy Preview for tauri-v2 ready!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify site configuration. |
|
PR deploy time: 2m 46s Current deploy time: 1m 52s 54s increase in deploy time
|
|
[update in the next comment] Local preview: Netlify preview:
(3) fixed I need input if I could continue to work on this. Thanks |
|
|
||
| // https://github.com/withastro/docs/blob/main/src/pages/0/0.ts | ||
| // https://www.github.com/withastro/docs/pull/4266/commits/030073f32d6dfe586c6e1da8d48d6b5485541ba2 | ||
|
|
There was a problem hiding this comment.
If we can't find an issue, can we open one to point to so we know when this hack may be replaced by an improved implementation.
There was a problem hiding this comment.
|
I'll revisit this soon because the head override will have to include the recent head changes someway, or find a way to inject the og metatags into the head without overriding it. This was expected and at the time I gave a shot at it but failed well... it can be as simple as just copying the contents tho... not sure... I'll look again |
|
is this needed for our 2.0 release or are we okay to have this later on @vasfvitor ? |
no need I'd say. |
Continuing from #1608
OUTDATED:
Still working on it. But thinking whether we should consider https://github.com/delucis/astro-og-canvas or another implementation. Current PR is based on: https://github.com/JonasKruckenberg/JonasKruckenberg/blob/main/src/pages/social-image/[...path].png.tsFiles:
astro.config.mjs- Added Head component override; Updated Footer override reference; removed head meta tagstemplates.ts- receives the frontmatter data to build SVG that will be processed by Sharp. Currently it's all done inline.utils.ts- helper functions[...path].png.ts- Astro dynamic routes mixed with social-image generation via Sharp. It has to be in /pagesReference:https://docs.astro.build/en/core-concepts/endpoints/#static-file-endpointshttps://docs.astro.build/en/core-concepts/routing/#dynamic-routestsconfig.json- import alias to /assets where the .ts files areIssue:Locally the font (SF-Pro) is working, but still need to check how live/preview build will behave. Sharp can't process embedded fonts in SVG. So the current implementation has SVG importing a font file. But Sharp apparently needs the font to be installed in the system (by default, SF-Pro will not be on netlify and possible any other font will), so maybe we'll need fonts.conf file.