How to fix meta description too long on Nuxt.js

Steps for Nuxt.js

1. Locate every page component (e.g. pages/index.vue, pages/products/[slug].vue, pages/categories/[slug].vue) and any shared SEO composable that sets the meta description.
2. Replace raw, hard-coded description strings with a truncation utility (truncateDesc) that enforces a hard cap of 155 characters, preserving whole words and appending '…' only when the source string exceeds the limit.
3. Pass the sanitised description to useSeoMeta({ description }) (preferred — Nuxt 3) or useHead({ meta: [{ name: 'description', content }] }) in every page where meta is set.
4. For dynamic pages that fetch product/category data (e.g. via useAsyncData or useFetch), call truncateDesc on the API-returned description field before handing it to useSeoMeta so CMS copy that is too long is automatically capped.
5. Add a composable file (composables/useTruncateDesc.ts) so the helper is auto-imported project-wide — no manual import required in any page.
6. Validate the output length in your CI pipeline or with Nuxt DevTools by inspecting the rendered <meta name='description'> tag and confirming it is ≤ 160 characters.

What is meta description too long?

A meta description is the short paragraph of text that appears beneath your page title in Google search results (the "snippet"). It is written in your page's HTML and is meant to entice searchers to click your link. Google recommends keeping it under roughly 160 characters — including spaces and punctuation. When it is longer than that, Google truncates it mid-sentence and replaces the end with an ellipsis (…), which can make your listing look incomplete or unprofessional. Note that Google may also rewrite your description entirely if it decides another passage on the page is more relevant, but providing a well-crafted, correctly-sized description gives you the best chance of controlling what shoppers see.

Your meta description is your free advertising copy in search results — it is often the deciding factor in whether a shopper clicks your link or a competitor's. A truncated description cuts off your call to action, hides key selling points (such as a store location, a brand name, or a promotion), and signals a lack of attention to detail that can erode trust before the visitor even lands on your site. Pages with compelling, complete meta descriptions consistently achieve higher click-through rates (CTR), and higher CTR sends a positive engagement signal that can reinforce your rankings over time. For multilingual and multibyte character sets (Japanese, Chinese, Korean, Arabic, etc.) the character budget can effectively be even shorter because each character is wider — aim for 70–80 characters to be safe, or test rendered pixel width with Google's Rich Results tools.

See the complete Meta description too long guide for every platform and the full background.