chore: extract plain text for meta descriptions and refine blog SEO

- Added `extractPlainTextFromExcerpt` utility to process `excerpt` AST.
- Updated SEO metadata in blog pages with improved description handling using plain text extraction.
- Enhanced type definitions for `BlogSEO` and updated `BlogArticle` interface.
- Refined Open Graph (`og`) and Twitter metadata logic in blog components.

Author: TheMeinerLP

pages/blog/[...slug].vue

@@ -2,6 +2,7 @@
 import {definePageMeta} from "#imports";
 import SocialMediaShare from "~/components/blog/SocialMediaShare.vue";
 import type { BlogArticle } from "~/types/blog";
+import { extractPlainTextFromExcerpt } from "~/utils/content";
 
 const { locale, t, d } = useI18n()
 const config = useRuntimeConfig()
@@ -23,6 +24,12 @@ const previewSocial = computed(() =>
   })
 )
 
+// Canonical URL for OG tags
+const baseUrl = computed(() => config.public.siteUrl || config.public.baseUrl || 'https://blog.onelitefeather.net')
+const canonicalUrl = computed(() =>
+  blog.value ? (blog.value.canonical || `${baseUrl.value}/${locale.value}/blog/${blog.value.slug}`) : baseUrl.value
+)
+
 // Use a single useHead call to set links (and merge with any useSeoMeta output)
 useHead(() => ({ link: headLinks.value }))
 useHead(() => (blog.value as BlogArticle | null)?.head || {})
@@ -39,15 +46,20 @@ const title = computed(() => {
 useSeoMeta(() => {
   const seo = (blog.value as any)?.seo || {}
   const metaTitle = seo.title || title.value
-  const metaDescription = seo.description || blog.value?.description || ''
+  const metaDescription =
+    seo.description || blog.value?.description || extractPlainTextFromExcerpt((blog.value as any)?.excerpt) || ''
   return {
     title: metaTitle,
     ogTitle: seo.ogTitle || metaTitle,
     twitterTitle: seo.twitterTitle || metaTitle,
     description: metaDescription,
     ogDescription: seo.ogDescription || metaDescription,
     ogImage: previewSocial.value,
-    twitterImage: previewSocial.value
+    twitterImage: previewSocial.value,
+    ogType: 'article',
+    ogUrl: canonicalUrl.value,
+    twitterCard: 'summary_large_image',
+    ogImageAlt: blog.value?.headerImageAlt || blog.value?.title || ''
   }
 })
 </script>

types/blog.ts

@@ -10,11 +10,22 @@ export interface BlogAlternateLanguageLink {
   url: string
 }
 
+export interface BlogSEO {
+  title?: string
+  description?: string
+  ogTitle?: string
+  ogDescription?: string
+  twitterTitle?: string
+  twitterDescription?: string
+}
+
 // Extend content-generated item type with optional new header fields
 export type BlogArticle = (
   | BlogDeCollectionItem
   | BlogEnCollectionItem
 ) & {
   canonical?: string
   alternates?: BlogAlternateHeader[]
+  seo?: BlogSEO
+  head?: Record<string, any>
 }

utils/content.ts

@@ -0,0 +1,44 @@
+/**
+ * Utilities for working with @nuxt/content document structures.
+ * Focus: extracting plain text from the `excerpt` AST for meta descriptions.
+ */
+
+export function extractPlainTextFromExcerpt(excerpt: any, maxLength = 180): string {
+  if (!excerpt) return ''
+
+  // Nuxt Content often provides an object with `type` and `children`
+  const parts: string[] = []
+
+  const walk = (node: any) => {
+    if (!node) return
+    // Text node
+    if (typeof node.value === 'string') {
+      parts.push(node.value)
+      return
+    }
+    // Element with children (paragraphs, links, strong, etc.)
+    if (Array.isArray(node.children)) {
+      for (const child of node.children) walk(child)
+      // Add space between block-ish nodes
+      if (node.type === 'paragraph') parts.push(' ')
+      return
+    }
+    // Arrays of nodes
+    if (Array.isArray(node)) {
+      for (const child of node) walk(child)
+      return
+    }
+  }
+
+  walk(excerpt)
+
+  const text = parts.join(' ').replace(/\s+/g, ' ').trim()
+  if (!text) return ''
+
+  if (text.length <= maxLength) return text
+  // Soft trim at word boundary
+  const clipped = text.slice(0, maxLength)
+  const lastSpace = clipped.lastIndexOf(' ')
+  return (lastSpace > 0 ? clipped.slice(0, lastSpace) : clipped).trim() + '…'
+}
+