nextjs - 💡(How to fix) Fix [Bug] Static metadata (export const metadata) rendered in <body> instead of <head> in 15.5.4 [1 comments, 2 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#84749Fetched 2026-04-08 02:18:35
View on GitHub
Comments
1
Participants
2
Timeline
7
Reactions
0
Author
Timeline (top)
labeled ×3closed ×1commented ×1issue_type_added ×1

Fix Action

Fix / Workaround

Workaround

Downgrade to Next.js 15.2.4:

Code Example

git clone https://github.com/SEU-USERNAME/nextjs-metadata-bug
  cd nextjs-metadata-bug
  npm install

  Step 2: Start development server

  npm run dev

  Step 3: Inspect HTML

  1. Open http://localhost:3000
  2. Open DevTools (F12)
  3. Inspect the HTML structure
  4. Search for meta tags (e.g., og:title, fb:app_id, twitter:card)
  5. Notice all meta tags are rendered inside <body> instead of <head>

### Current vs. Expected behavior

---

<!DOCTYPE html>
  <html lang="en">
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <!-- Only basic Next.js meta tags, no custom metadata -->
    </head>
    <body>
      <!--WRONG: All custom metadata appears here -->
      <title>Test App</title>
      <meta name="description" content="Testing metadata bug in Next.js 15.5.4">
      <meta property="og:title" content="Test App">
      <meta property="fb:app_id" content="123456789">
      <meta name="twitter:card" content="summary_large_image">
      <!-- etc. -->
    </body>
  </html>

  Expected Behavior (15.2.4) - CORRECT
  All metadata tags should be rendered inside <head>

  Impact

  This bug causes severe SEO and social sharing issues:

  1. Open Graph broken: Facebook, LinkedIn, WhatsApp ignore meta tags in <body>
  2. Twitter Cards broken: Twitter expects meta tags in <head>
  3. SEO issues: Search engines may not properly parse metadata from <body>
  4. HTML validation fails: Meta tags in <body> violate W3C standards

### Provide environment information

---

### Which area(s) are affected? (Select all that apply)

Headers, Metadata

### Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local)

### Additional context

## Regression Details

  The bug was introduced between versions:
  - **15.2.4** (working)  - **15.5.4** (broken)
  ## Workaround

  Downgrade to Next.js 15.2.4:
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/fabiotheo/nextjs-metadata-bug/settings

To Reproduce

Step 1: Clone the reproduction repository

git clone https://github.com/SEU-USERNAME/nextjs-metadata-bug
cd nextjs-metadata-bug
npm install

Step 2: Start development server

npm run dev

Step 3: Inspect HTML

1. Open http://localhost:3000
2. Open DevTools (F12)
3. Inspect the HTML structure
4. Search for meta tags (e.g., og:title, fb:app_id, twitter:card)
5. Notice all meta tags are rendered inside <body> instead of <head>

### Current vs. Expected behavior

```markdown
## Current Behavior (15.5.4) - BROKEN ❌

All metadata tags defined via `export const metadata` are incorrectly rendered **inside `<body>`** instead of `<head>`:

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Only basic Next.js meta tags, no custom metadata -->
  </head>
  <body>
    <!-- ❌ WRONG: All custom metadata appears here -->
    <title>Test App</title>
    <meta name="description" content="Testing metadata bug in Next.js 15.5.4">
    <meta property="og:title" content="Test App">
    <meta property="fb:app_id" content="123456789">
    <meta name="twitter:card" content="summary_large_image">
    <!-- etc. -->
  </body>
</html>

Expected Behavior (15.2.4) - CORRECT ✅

All metadata tags should be rendered inside <head>

Impact

This bug causes severe SEO and social sharing issues:

1. Open Graph broken: Facebook, LinkedIn, WhatsApp ignore meta tags in <body>
2. Twitter Cards broken: Twitter expects meta tags in <head>
3. SEO issues: Search engines may not properly parse metadata from <body>
4. HTML validation fails: Meta tags in <body> violate W3C standards

### Provide environment information

```bash
Operating System:
Platform: darwin
Arch: arm64
Version: Darwin Kernel Version 24.6.0: Mon Jul 14 11:30:30 PDT 2025; root:xnu-11417.140.69~1/RELEASE_ARM64_T6020
Available memory (MB): 32768
Available CPU cores: 10
Binaries:
Node: 22.19.0
npm: 10.9.3
Yarn: 1.22.22
pnpm: 10.17.1
Relevant Packages:
next: 15.5.4 // Latest available version is detected (15.5.4).
eslint-config-next: N/A
react: 19.2.0
react-dom: 19.2.0
typescript: 5.9.3
Next.js Config:
output: N/A

Which area(s) are affected? (Select all that apply)

Headers, Metadata

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local)

Additional context

Regression Details

The bug was introduced between versions:

  • 15.2.4 (working) ✅
  • 15.5.4 (broken) ❌

Workaround

Downgrade to Next.js 15.2.4:

{
  "dependencies": {
    "next": "15.2.4"
  }
}

Documentation Reference

From Next.js docs (https://nextjs.org/docs/app/api-reference/file-conventions/layout):

Good to know: You should not manually add <head> tags such as <title> and <meta> to root layouts. Instead, you should use the Metadata API.

The docs clearly state metadata should be in <head>, but 15.5.4 puts it in <body>.

extent analysis

TL;DR

Downgrade to Next.js 15.2.4 to fix the metadata rendering issue where custom metadata tags are incorrectly rendered inside the <body> instead of the <head>.

Guidance

  • The issue is likely caused by a regression introduced between Next.js versions 15.2.4 and 15.5.4.
  • To verify the issue, inspect the HTML structure of the page and check if the custom metadata tags are rendered inside the <body> instead of the <head>.
  • To mitigate the issue, downgrade to Next.js 15.2.4 by updating the next version in the package.json file.
  • Alternatively, wait for a future update of Next.js that fixes the regression.

Example

No code snippet is provided as the issue is related to a version regression and not a code-specific problem.

Notes

The provided workaround is based on the information given in the issue and may not be applicable in all scenarios. It is recommended to test the downgrade in a development environment before applying it to production.

Recommendation

Apply the workaround by downgrading to Next.js 15.2.4, as it is a known working version that correctly renders metadata tags inside the <head>.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING