How to Export Metadata from MDX for Next.js SEO
Next.js supports exporting a metadata object from your MDX files, which can be
used to enhance SEO and social sharing features. This is especially useful for
blog posts and documentation pages.
Example: Exporting Metadata
You can export a metadata object at the top of your MDX file like this:
export const metadata = {
title: "How to Export Metadata from MDX for Next.js SEO",
description:
"A guide on exporting metadata from MDX files to leverage Next.js SEO features.",
authors: [{ name: "Jane Doe", url: "https://janedoe.com" }],
openGraph: {
images: ["https://cdn.cosmos.so/example-image.jpg"],
},
};This metadata will be picked up by Next.js and can be used for SEO, Open Graph, and other meta tags.
Why Use Metadata in MDX?
- SEO: Improve your page's search engine ranking with relevant titles and descriptions.
- Social Sharing: Enhance how your content appears when shared on social media platforms.
- Consistency: Keep your metadata close to your content for easier management.
Further Reading
This post demonstrates how to export metadata from MDX files for use with Next.js SEO features, inspired by leerob's site.