Creating OgImage and adding meta tags for Home page

[opdev1004]

Since we added the SEO plugin, now we can gennerate our own Ogimage from Vue component or use default one from Nuxt SEO, Nuxt and other community's preset. I think we still needs to use useSeoMeta from Nuxt.

Example of default OG image:

defineOgImageComponent("NuxtSeo", {
  title: "Redot Engine",
  description: "Open‑source Multi-platform 2D and 3D game engine for everyone",
  theme: "#FF6E01",
  colorMode: "dark",
});

useSeoMeta({
  title: "Redot Engine, game engine for everyone",
  ogTitle: "Redot Engine, game engine for everyone",
  description: "Open‑source Multi-platform 2D and 3D game engine",
  ogDescription: "Open‑source Multi-platform 2D and 3D game engine",
});

So I or anyone can add this but I want to confirm about content of these meta tag data.

If I do this I may setup for blog posts as well.

[opdev1004]

#32 will do basic setting.

defineOgImageComponent("RedotOG", {
  title: "Redot Engine",
  description: "Open‑source Multi-platform 2D and 3D game engine for everyone",
  imageUrl: "",
  backgroundColor: "#000000",
  brandColor: "#FF6E01",
});

useSeoMeta({
  title: "Redot Engine, game engine for everyone",
  ogTitle: "Redot Engine, game engine for everyone",
  description: "Open‑source Multi-platform 2D and 3D game engine",
  ogDescription: "Open‑source Multi-platform 2D and 3D game engine",
});

[reflexguru]

i'm currently working on banners in figma. check the "social banners" page.

example, not final:

[opdev1004]

maybe just adding an image better

[opdev1004]

I'll create a pull request after the OG image is added