search

nuxt-modules / og-image

Generate OG Images with Vue templates in Nuxt.
https://nuxtseo.com/og-image
400 stars 25 forks source link

Support JPEG OG Images #95

Closed adydetra closed 9 months ago

adydetra commented 11 months ago

Clear and concise description of the problem

By default nuxt-og-image will convert the result to png.

image

But sometimes I encounter cases where my bg color become transparent, including gradients. both vanilla CSS and tailwindcss. for example, I once shared via Discord.

And I found a solution after I changed some code. but in my opinion it is quite time consuming and requires a little logic even though it is just simple CSS styling.

in the sense that I need the results in jpg format, so there are no transparent colors.

Suggested solution

I think it would be really cool if we could choose the image format in the configuration. examples of png, jpg, and webp.

maybe we can do the configuration in nuxt.config.ts or in defineOgImage.

Alternative

No response

Additional context

No response

harlan-zw commented 10 months ago

In v3 you'll definitely be able to do this with the browser renderer. For Satori I think the best option is to integrate with Nuxt Image somehow, will need to do some more research on this.

harlan-zw commented 9 months ago

This is now supported with the v3 rc. See the docs https://nuxtseo.com/og-image/guides/jpegs