-
Describe the problemHello, I'm looking for providing easy way to dynamically generate open-graph images using Sveltekit. This function exists in Next.js but not in Sveltekit. Describe the proposed solutionIs it possible to make something like https://www.npmjs.com/package/next-api-og-image? Alternatives consideredNo response Importancenice to have Additional InformationNo response |
Beta Was this translation helpful? Give feedback.
Replies: 2 comments 6 replies
-
|
See https://geoffrich.net/posts/svelte-social-image/ and sveltejs/sites#412 for examples |
Beta Was this translation helpful? Give feedback.
-
|
Thank you! The integration of Vercel plugin seems perfect solution for me. Should I install |
Beta Was this translation helpful? Give feedback.
-
|
It is not installed by SvelteKit by default, so you will need to install it |
Beta Was this translation helpful? Give feedback.
-
|
Does anyone have a good pattern for static image generation? I.e. using adapter-static and generating a templated OG image for each page, based on, for example, the title and description. I've been playing around with some options but unclear where to store files to make it DRY: single SEO route/og.png?title=Foo&description=bar problem: cannot access the search params in SSG many SEO routes/foo/og.png problem: needing to create many +server.js files is a pain something else? |
Beta Was this translation helpful? Give feedback.
-
|
What about a |
Beta Was this translation helpful? Give feedback.
-
|
Good idea, EDIT: |
Beta Was this translation helpful? Give feedback.
-
|
You can also do |
Beta Was this translation helpful? Give feedback.
-
|
@benmccann this was an interesting approach i experimented with, but it didn't handle cases where the title or description were missing, which is the case for many of our pages For anyone interested in the final approach i went for, see this PR: evidence-dev/evidence#2985
|
Beta Was this translation helpful? Give feedback.
See https://geoffrich.net/posts/svelte-social-image/ and sveltejs/sites#412 for examples