App Router yana da Metadata API da ke gida don alamomi na SEO (<title>, <meta>, Open Graph, da sauransu) — ka bugi metadata daga layout.tsx ko page.tsx kuma Next.js yana aika da daidaitaccen alamomi <head>.
App Router yana da Metadata API da ke gida don alamomi na SEO (<title>, <meta>, Open Graph, da sauransu) — ka bugi metadata daga layout.tsx ko page.tsx kuma Next.js yana aika da daidaitaccen alamomi <head>.
// app/about/page.tsx
import type { Metadata } from "next";
export const metadata: Metadata = {
title: "About Us",
description: "Learn about our company and team.",
openGraph: {
title: "About Us",
images: ["/og-about.png"],
},
};
export default function About() { return <h1>About</h1>; }
Next.js yana karanta abubuwan metadata da aka bugi kuma yana aiki <title>, <meta name="description">, alamomi na OG, da sauransu — babu jefa-jefa na <head>.
Gare shafuka wajen da taken ya dogara da abin da aka kaiwo (artikuwar blog, kayan siyarwa), bugi aikin generateMetadata na asynchronous:
// app/blog/[slug]/page.tsx
export async function generateMetadata({ params }): Promise<Metadata> {
const post = await getPost(params.slug); // fetch the post
return {
title: post.title,
description: post.excerpt,
openGraph: { images: [post.coverImage] },
};
}
Wannan yana aiki akan serverin kuma yana ba da damar kowane shafun dynamic ya sami daidaitaccen metadata masu kusanci ga abin - mahimmanci don SEO da rarraba jama'a na abin da ke canzawa.
// app/layout.tsx — defaults + a title template
export const metadata: Metadata = {
title: { default: "My Site", template: "%s | My Site" }, // child titles become "About | My Site"
};
Metadata da aka sanya a cikin layout yana hadarwa da (kuma ana iya cirewa ta) shafuka na yara — don haka ka sanya abubuwan sakanda na gida sau ɗaya kuma ƙimar kowane shafi inda aka buƙata. template yana ta addawa sunan gida ta atomatik.
app/favicon.ico, app/opengraph-image.png, app/robots.ts, app/sitemap.ts
Fayiloli na musamman suna aiki metadata/hanyoyi da aka saba da shi ta atomatik.
Metadata mai kyau yana bugi SEO da alamomun rarraba jama'a.
Metadata API yana sanya shi a shahararren yanayi da na nau'i — static metadata don shafuka masu karewa, asynchronous generateMetadata don shafuka wajen bayani, kuma abubuwan sakanda na layout-level tare da alamu — sauye jefa-jefa na <head> da tsari tace, tsarin serverin da aka aiki ta sannu.