Svelte
You're viewing Unhead v3 beta documentation. Install with unhead@beta
Plugins

Infer SEO Meta

Quick Answer: The Infer SEO Meta plugin automatically generates og:title, og:description, and twitter:card from your existing title and description tags, reducing duplicate meta tag definitions.

What Does This Plugin Do?

The Infer SEO Meta plugin automatically generates Open Graph and Twitter meta tags from your existing content:

  • og:title - Inferred from your page title
  • og:description - Inferred from your description meta
  • twitter:card - Set automatically when using og:image

Use this plugin when you want to avoid duplicating your page title and description across Open Graph and Twitter meta tags. It's ideal for sites that need consistent social sharing metadata without manual repetition.

How Does the Output Look?

Input
useHead({
  title: 'My Page Title',
  meta: [
    { name: 'description', content: 'A description of my page' }
  ]
})
Output
<title>My Page Title</title>
<meta name="description" content="A description of my page">
<meta property="og:title" content="My Page Title">
<meta property="og:description" content="A description of my page">

How Do I Set Up the Plugin?

Add the plugin to your Unhead configuration:

Input
import { InferSeoMetaPlugin } from 'unhead/plugins'

const head = createHead({
  plugins: [
    InferSeoMetaPlugin()
  ]
})

// or

head.use(InferSeoMetaPlugin())

What Options Can I Configure?

You can customize how the plugin transforms your content:

Input
export interface InferSeoMetaPluginOptions {
  /**
   * Transform the og title.
   *
   * @param title
   */
  ogTitle?: ((title: string) => string)
  /**
   * Transform the og description.
   *
   * @param description
   */
  ogDescription?: ((description: string) => string)
  /**
   * The twitter card to use.
   *
   * @default 'summary_large_image'
   */
  twitterCard?: false | 'summary' | 'summary_large_image' | 'app' | 'player'
}

How Do I Customize the OG Title?

Remove site name suffix from Open Graph titles:

Input
import { InferSeoMetaPlugin } from 'unhead/plugins'

const head = createHead({
  plugins: [
    InferSeoMetaPlugin({
      ogTitle: title => title.replace('- My Site', '')
    })
  ]
})

How Do I Disable Twitter Cards?

If you don't want Twitter cards generated:

Input
InferSeoMetaPlugin({
  twitterCard: false
})

How Do I Format OG Descriptions?

Append a call-to-action to your Open Graph descriptions:

Input
InferSeoMetaPlugin({
  ogDescription: description => `${description} Learn more now!`
})
Did this page help you?