Route Rules

In some cases, you'll want to apply OG Image setting for a subset of pages.

You can handle this even easier with the route rule merging.

This lets you provide a ogImage key that will be either used or merged into the existing OG Image options.

For example, this documentation website uses it to set the icon depending on your path.

export default defineNuxtConfig({
  routeRules: {
    '/og-image/**': {
      ogImage: {
        props: { icon: 'carbon:image-search' }
      }
    }
  }
})

Wildcard Route Rules Warning

Using wildcard route rules like /** with caching options (swr, isr, or cache) can break OG Image routes.

export default defineNuxtConfig({
  routeRules: {
    // ⚠️ This will break og-image routes
    '/**': { swr: 60 * 4 },
  }
})

This is due to a known Nitro limitation where you cannot exclude specific routes from wildcard cache rules.

Workaround: Use specific route patterns instead of wildcards:

export default defineNuxtConfig({
  routeRules: {
    '/blog/**': { swr: 60 * 4 },
    '/products/**': { swr: 60 * 4 },
    // Add specific patterns for your routes
  }
})