erojas.devertek.io logo
Building Dynamic Metadata for Next.js: A Complete Implementation Guide

The Challenge

When building our Next.js application, we quickly realized that static metadata wasn't going to cut it. We needed:

  • Dynamic metadata for blog posts with proper SEO

  • Consistent branding across all pages

  • Social media optimization (OpenGraph, Twitter cards)

  • A maintainable system that scales

The Solution: Metadata Utility Functions We created a centralized metadata system using utility functions that generate consistent, SEO-optimized metadata for different content types.

1export function generateBlogMetadata(post: BlogPost): Metadata {
2  return {
3    title: `${post.title} | ertek.io`,
4    description: post.excerpt,
5    openGraph: {
6      title: post.title,
7      description: post.excerpt,
8      type: 'article',
9      publishedTime: post.publishedAt,
10      authors: post.author ? [post.author] : undefined,
11      tags: post.tags,
12    },
13    twitter: {
14      card: 'summary_large_image',
15      title: post.title,
16      description: post.excerpt,
17    },
18  }
19}