SEO

Opengraph

Opengraph image specification

The image for opengraph must have dimensions 1200x630px, rename it to opengraph-image.png and place it in the src/app folder

Merge main title with that of the current page

// layout.ts
export const metadata: Metadata = {
  metadataBase: new URL("https://oberonacademy.com.br"),
  title: {
    default: "Oberon Academy",
    template: "%s - Oberon Academy",
  },
  description: "Tools for editing and formatting.",
};

// anything page
export const metadata: Metadata = {
  title: "About",
};

Fully subscribe with page title

export const metadata: Metadata = {
  title: {
    absolute: "About",
  },
};

Load the title dynamically

export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const { post } = await params;

  return {
    title: post.charAt(0).toUpperCase() + post.slice(1),
  };
}

Load image dynamically

export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const { post } = await params;

  const meta = (await import(`@/content/blog/nextjs/${post}.en.mdx`)).meta;

  return {
    title: post.charAt(0).toUpperCase() + post.slice(1),
    openGraph: {
      images: [
        {
          url: meta.image,
        },
      ],
    },
  };
}

Generate static params

anything page dynamically needs to be generated statically in the generateStaticParams function below or else it will not work properly because NextJS does not know how many pages you have and what they are named dynamically at runtime

export async function generateStaticParams() {
  const metas = getNameLocationOfMdxFiles("src/content/blog/nextjs");

  return metas.map((meta) => ({ locale: meta.locale, post: meta.name }));
}

Sitemap

// src/app/sitemap.ts
import { MetadataRoute } from "next";

const base = "https://oberonacademy.com.br";

export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
  return [
    {
      url: `${base}/about`,
      lastModified: new Date("2025-09-04T00:00:00.000Z").toISOString(),
    },
  ];
}

Visit /sitemap.xml to debug, the output will be like this:

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://oberonacademy.com.br/about</loc>
    <lastmod>2025-09-04T00:00:00.000Z</lastmod>
  </url>
</urlset>

Robots

// src/app/robots.ts
import { MetadataRoute } from "next";

const base = "https://oberonacademy.com.br";

export default async function robots(): Promise<MetadataRoute.Robots> {
  return {
    rules: [
      {
        userAgent: "*",
        allow: "/",
        disallow: ["/admin"],
      },
    ],
    sitemap: `${base}/sitemap.xml`,
  };
}

Visit /robots.txt to debug, the output will be like this:

User-Agent: *
Allow: /
Disallow: /admin

Sitemap: https://oberonacademy.com.br/sitemap.xml

OberonAcademy

SEO