web3templates/stablo

How to Change the OGP Image for Each Post?

ksuhara opened this issue · 1 comments

I have changed post/[slug]/page.tsx to this.

export async function generateMetadata({ params }) {
  const post = await getPostBySlug(params.slug);
  const ogimage = urlForImage(post?.mainImage) ?? "";
  return {
    title: post.title,
    description: post.description,
    canonical: post.canonical,
    openGraph: {
      url: post.url,
      title: post.title,
      description: post.description,
      images: [
        {
          url: ogimage.src,
          width: 800,
          height: 600,
          alt: post.title
        }
      ],
      site_name: post.title
    },
    twitter: {
      handle: "@suhara_ponta",
      site: "@suhara_ponta",
      cardType: "summary_large_image"
    }
  };
}

↑This seems to work but are there any other anticipated best practice implementations?
Also, the metadata of twitter:card will be <meta name="twitter:card" content="summary"> even if I set cardType: "summary_large_image" . Any Idea why this is happening?