OG Image Fallback

The app generates a branded Open Graph image automatically when a Contentstack entry has no metadata.image.

Endpoint

• /api/og?title={title}&type={type}&path={path}

The endpoint uses Next.js ImageResponse (next/og) and returns a 1200x630 image suitable for social sharing.

Metadata Integration

lib/contentstack/metadata.ts now resolves OG images like this:

1. Use CMS image (metadata.image.url) when available.
2. If missing, build a fallback URL to /api/og with:
   • title: entry title
   • type: normalized content type label (Blog Post, Guide, Live Stream, etc.)
   • path: entry URL path

Card Integration

List cards and typeahead/search cards also use the OG generator as a fallback when entry/card images are missing.

• Linked cards (linked_cards) fall back from metadata.image to generated /api/og.
• Static cards (cards) fall back from uploaded image and image_url to generated /api/og.
• Search suggestions include generated /api/og images when metadata.image is absent.

Behavior Notes

• Fallback OG image URLs are absolute and use getBaseUrl() from lib/contentstack/sitemap.ts.
• The renderer uses a unified teal-focused visual style across all fallback OG images.
• The OG header combines app/favicon.svg and public/Developers_Dark.svg.
• The header no longer renders a top-right content-type badge.
• The title and path are grouped at the bottom; longer titles grow upward above the path row.
• It attempts to use local Beausite brand fonts and safely falls back to system fonts if unavailable.
• The generator clamps input length for stable rendering and safe layout.
• Existing CMS-defined OG images always take precedence.