Nitro Hooks · Nuxt OG Image · Nuxt SEO

[NuxtSEO](https://nuxtseo.com/ "Home")

- [Modules](https://nuxtseo.com/docs/nuxt-seo/getting-started/introduction)
- [Tools](https://nuxtseo.com/tools)
- [Pro](https://nuxtseo.com/pro)
- [Learn SEO](https://nuxtseo.com/learn-seo/nuxt) [Releases](https://nuxtseo.com/releases)

[1.4K](https://github.com/harlan-zw/nuxt-seo)

[Nuxt SEO on GitHub](https://github.com/harlan-zw/nuxt-seo)

**OG Image v6** is here! Looking for an older version? [View v5 docs](https://nuxtseo.com/docs/og-image/v5/getting-started/introduction).

[User Guides](https://nuxtseo.com/docs/og-image/getting-started/introduction)

[API](https://nuxtseo.com/docs/og-image/api/define-og-image)

[Releases](https://nuxtseo.com/docs/og-image/releases/v6)

OG Image

- [Switch to OG Image](https://nuxtseo.com/docs/og-image/getting-started/introduction)
- [Switch to Nuxt SEO](https://nuxtseo.com/docs/nuxt-seo/getting-started/introduction)
- [Switch to Robots](https://nuxtseo.com/docs/robots/getting-started/introduction)
- [Switch to Sitemap](https://nuxtseo.com/docs/sitemap/getting-started/introduction)
- [Switch to Schema.org](https://nuxtseo.com/docs/schema-org/getting-started/introduction)
- [Switch to Link Checker](https://nuxtseo.com/docs/link-checker/getting-started/introduction)
- [Switch to SEO Utils](https://nuxtseo.com/docs/seo-utils/getting-started/introduction)
- [Switch to Site Config](https://nuxtseo.com/docs/site-config/getting-started/introduction)
- [Switch to Skew Protection](https://nuxtseo.com/docs/skew-protection/getting-started/introduction)
- [Switch to AI Ready](https://nuxtseo.com/docs/ai-ready/getting-started/introduction)

Search…```k`` /`

v6 (latest)

- Playgrounds
- [Discord Support](https://discord.com/invite/275MBUBvgP)

### Nuxt API

- [`defineOgImage()`](https://nuxtseo.com/docs/og-image/api/define-og-image)
- [`defineOgImageComponent()`](https://nuxtseo.com/docs/og-image/api/define-og-image-component)
- [`defineOgImageScreenshot()`](https://nuxtseo.com/docs/og-image/api/define-og-image-screenshot)
- [Components](https://nuxtseo.com/docs/og-image/api/components)
- [nuxt.config.ts](https://nuxtseo.com/docs/og-image/api/config)
- [Nuxt Hooks](https://nuxtseo.com/docs/og-image/api/nuxt-hooks)

### Nitro API

- [Nitro Hooks](https://nuxtseo.com/docs/og-image/nitro-api/nitro-hooks)

Nitro API

# Nitro Hooks

[Copy for LLMs](https://nuxtseo.com/docs/og-image/nitro-api/nitro-hooks.md)

Runtime hooks for Nuxt OG Image.

## [`nuxt-og-image:context`](#nuxt-og-imagecontext)

**Type:** `async (ctx: OgImageRenderEventContext) => void | Promise<void>`

The module calls this when it generates the render context. Within this object, you can control the entire behavior of the render.

server/plugins/ogImage.ts

```
import { defineNitroPlugin } from 'nitropack/runtime/plugin'

export default defineNitroPlugin((nitroApp) => {
  nitroApp.hooks.hook('nuxt-og-image:context', async (ctx) => {
    // e is the H3Event
    if (!ctx.e.path.startsWith('/fancy-og-images/'))
      return

    // modify props (usually better suited in route rules)
    ctx.options.props.isFancy = true
    // make all images use the same cache key
    ctx.key = 'fancy-og-images'
  })
})
```

## [`nuxt-og-image:satori:vnodes`](#nuxt-og-imagesatorivnodes)

**Type:** `async (vnodes: VNode, ctx: OgImageRenderEventContext) => void | Promise<void>`

The module calls this when it generates the Satori vnodes. Use this hook to modify the final content passed to Satori.

server/plugins/ogImage.ts

```
import { defineNitroPlugin } from 'nitropack/runtime/plugin'

export default defineNitroPlugin((nitroApp) => {
  nitroApp.hooks.hook('nuxt-og-image:satori:vnodes', async (vnodes, ctx) => {
    const children = vnodes.props.children
    if (!Array.isArray(children))
      return
    for (const child of children) {
      if (typeof child === 'string' || !child)
        continue
      // remove icon class from Nuxt Icon
      if (child.props?.class)
        child.props.class = child.props.class.replace('icon', '')
    }
  })
})
```

## [`nuxt-og-image:takumi:nodes`](#nuxt-og-imagetakuminodes)

**Type:** `async (nodes: Node, ctx: OgImageRenderEventContext) => void | Promise<void>`

The module calls this when it generates the Takumi nodes. Use this hook to modify the final node tree passed to the Takumi renderer. The `Node` type comes from `@takumi-rs/core`.

server/plugins/ogImage.ts

```
import { defineNitroPlugin } from 'nitropack/runtime/plugin'

export default defineNitroPlugin((nitroApp) => {
  nitroApp.hooks.hook('nuxt-og-image:takumi:nodes', async (nodes, ctx) => {
    // modify the Takumi node tree before rendering
    if (nodes.style)
      nodes.style.backgroundColor = '#000000'
  })
})
```

[Edit this page](https://github.com/nuxt-modules/og-image/edit/main/docs/content/5.nitro-api/4.nitro-hooks.md)

[Markdown For LLMs](https://nuxtseo.com/docs/og-image/nitro-api/nitro-hooks.md)

Did this page help you?

[Nuxt I18n How to use the Nuxt OG Image module with @nuxtjs/i18n.](https://nuxtseo.com/docs/og-image/integrations/i18n) [v2 to v3 Migrate Nuxt OG Image v2 to Nuxt OG Image v3.](https://nuxtseo.com/docs/og-image/migration-guide/v3)

On this page

- [nuxt-og-image:context](#nuxt-og-imagecontext)
- [nuxt-og-image:satori:vnodes](#nuxt-og-imagesatorivnodes)
- [nuxt-og-image:takumi:nodes](#nuxt-og-imagetakuminodes)

[GitHub](https://github.com/harlan-zw/nuxt-seo) [ Discord](https://discord.com/invite/275MBUBvgP)

### [NuxtSEO](https://nuxtseo.com/ "Home")

- [Getting Started](https://nuxtseo.com/docs/nuxt-seo/getting-started/introduction)
- [MCP](https://nuxtseo.com/docs/nuxt-seo/guides/mcp)

Modules

- [Robots](https://nuxtseo.com/docs/robots/getting-started/introduction)
- [Sitemap](https://nuxtseo.com/docs/sitemap/getting-started/introduction)
- [OG Image](https://nuxtseo.com/docs/og-image/getting-started/introduction)
- [Schema.org](https://nuxtseo.com/docs/schema-org/getting-started/introduction)
- [Link Checker](https://nuxtseo.com/docs/link-checker/getting-started/introduction)
- [SEO Utils](https://nuxtseo.com/docs/seo-utils/getting-started/introduction)
- [Site Config](https://nuxtseo.com/docs/site-config/getting-started/introduction)
- [Skew Protection](https://nuxtseo.com/docs/skew-protection/getting-started/introduction)
- [AI Ready](https://nuxtseo.com/docs/ai-ready/getting-started/introduction)

### [NuxtSEO Pro](https://nuxtseo.com/pro "Nuxt SEO Pro")

- [Getting Started](https://nuxtseo.com/pro)
- [Dashboard](https://nuxtseo.com/pro/dashboard)
- [Pro MCP](https://nuxtseo.com/pro/docs/getting-started/mcp-setup)

### [Learn SEO](https://nuxtseo.com/learn-seo "Learn SEO")

Nuxt

- [Mastering Meta](https://nuxtseo.com/learn-seo/nuxt/mastering-meta)
- [Controlling Crawlers](https://nuxtseo.com/learn-seo/nuxt/controlling-crawlers)
- [Launch & Listen](https://nuxtseo.com/learn-seo/nuxt/launch-and-listen)
- [Routes & Rendering](https://nuxtseo.com/learn-seo/nuxt/routes-and-rendering)
- [Staying Secure](https://nuxtseo.com/learn-seo/nuxt/routes-and-rendering/security)

Vue

- [Vue SEO Guide](https://nuxtseo.com/learn-seo/vue)
- [Mastering Meta](https://nuxtseo.com/learn-seo/vue/mastering-meta)
- [Controlling Crawlers](https://nuxtseo.com/learn-seo/vue/controlling-crawlers)
- [SPA SEO](https://nuxtseo.com/learn-seo/vue/spa)
- [SSR Frameworks](https://nuxtseo.com/learn-seo/vue/ssr-frameworks)
- [SEO Checklist](https://nuxtseo.com/learn-seo/checklist)
- [Pre-Launch Warmup](https://nuxtseo.com/learn-seo/pre-launch-warmup)
- [Backlinks & Authority](https://nuxtseo.com/learn-seo/backlinks)

### [Tools](https://nuxtseo.com/tools "SEO Tools")

- [Social Share Debugger](https://nuxtseo.com/tools/social-share-debugger)
- [Robots.txt Generator](https://nuxtseo.com/tools/robots-txt-generator)
- [Meta Tag Checker](https://nuxtseo.com/tools/meta-tag-checker)
- [HTML to Markdown](https://nuxtseo.com/tools/html-to-markdown)
- [XML Sitemap Validator](https://nuxtseo.com/tools/xml-sitemap-validator)
- [Schema.org Validator](https://nuxtseo.com/tools/schema-validator)
- [Keyword Idea Generator](https://nuxtseo.com/tools/keyword-generator)
- [Keyword Research](https://nuxtseo.com/tools/keyword-research)
- [SERP Analyzer](https://nuxtseo.com/tools/serp-analyzer)
- [Domain Rankings](https://nuxtseo.com/tools/domain-rankings)

Copyright © 2023-2026 Harlan Wilton - [MIT License](https://github.com/harlan-zw/nuxt-seo/blob/main/license) · [mdream](https://mdream.dev)