How to fix missing og description on Nuxt.js

Steps for Nuxt.js

1. Set a site-wide fallback og:description in nuxt.config.ts under app.head.meta so every page has a baseline Open Graph description even before page-level overrides are applied.
2. On each page component (e.g. pages/index.vue, pages/products/[slug].vue), call useSeoMeta() inside <script setup> and pass ogDescription with a value derived from the page's dynamic data (product description, category blurb, CMS field, etc.).
3. Fetch the page-specific description from your headless backend (e.g. Shopify Storefront API, Contentful, Sanity) before passing it to useSeoMeta(), using useAsyncData() or useFetch() so the tag is available during SSR.
4. For a shared layout pattern, create a composable (e.g. composables/useSeoDefaults.ts) that accepts a description string, applies truncation to ≤ 160 characters, and calls useSeoMeta() — then reuse it across every page.
5. Verify the tag is rendered server-side by running `nuxi build && nuxi preview` and inspecting the raw HTML with `curl` or browser DevTools → View Page Source; confirm <meta property="og:description" …> is present in the initial HTML payload.
6. Optionally audit all routes with a Lighthouse CI or a crawl script to assert no page returns a missing og:description, and add it to your CI pipeline.

What is missing og description?

The og:description tag is a small piece of HTML code placed in the `<head>` of your page that tells social networks — Facebook, Pinterest, LinkedIn, X (Twitter), WhatsApp, and others — what text to show beneath your page title when someone shares your link. It is part of the Open Graph protocol, a standard created so websites can control exactly how their content appears in social previews. Without it, social platforms will either grab random text from your page or show nothing at all, resulting in ugly, unhelpful link previews. It is separate from (but related to) your regular HTML meta description.

When a customer or influencer shares your product or collection page on social media, the preview card is often the first impression a potential buyer sees — before they even visit your store. A missing og:description means the platform guesses what to show, often pulling in irrelevant text like navigation labels, price fragments, or nothing at all, which dramatically reduces click-through rates. Rich, controlled social previews directly drive referral traffic and conversions, especially for product launches, promotions, and influencer marketing. There is also an indirect SEO benefit: higher engagement signals from social traffic can reinforce the authority of your pages in search rankings.

See the complete Missing og description guide for every platform and the full background.