🐛 Rules pages have no Open Graph image - shared links show no preview

[isaaclombardssw]

Pain

Sharing any SSW Rules link (Teams, Slack, LinkedIn, X, Facebook) shows no preview image. The Next.js site emits zero Open Graph or Twitter Card meta tags — not even a generic default.

curl -sL https://www.ssw.com.au/rules/rules-to-better-code/ | grep -i 'og:\|twitter:'
# (no output)

generateMetadata() in app/[filename]/page.tsx only sets title, description and canonical. app/layout.tsx has no openGraph, no twitter, and no metadataBase.

❌ Figure: Bad example — rules links share as a bare title + URL, no image

For comparison, www.ssw.com.au sets a default on every page:

<meta property="og:image" content="https://assets.tina.io/8a7b77f2-cde8-44e7-a592-ebeb7e9dc437/ssw-default-og.jpg"/>

✅ Figure: Good example — the main SSW site has a default OG image

Cause

This is a regression from the Gatsby → Next.js migration. The old src/components/head/head.js (deleted in 3c0fd0b "removing gatsby files") set the full set — og:title, og:description, og:type, og:site_name, og:url, og:image, twitter:card=summary_large_image, twitter:site, twitter:creator, fb:app_id — defaulting the image to /rules/assets/Open-Graph-images-Website-Rules.jpg. That asset now 404s too.

Suggested Solution

Use Next's Metadata API rather than hand-rolled tags:

• Set metadataBase + default openGraph / twitter in app/layout.tsx so every route inherits them (rules, categories, latest-rules, search, user, archived…)
• Add a default OG image (1200×630) to public/ — or point at the existing SSW default
• In each generateMetadata(), override openGraph.title / description / url with the page's own values

Tasks

• Get a default SSW Rules OG image (1200×630)
• Add metadataBase and default openGraph + twitter to app/layout.tsx
• Override per-page openGraph in the generateMetadata() functions (rules + categories first)
• Verify with an OG debugger and a real paste into Teams

Notes

Related to #1379 (dynamic per-rule OG images). This PBI is just the baseline default — #1379 is the nicer per-rule version to build on top of it.

[github-actions]

Pull request created: #2692

Generated by Issue Triage

[isaaclombardssw]

Consolidated into #2698, which merges this with the other duplicate Open Graph PBIs (#1379, #2691, #2697). Closing here — please follow #2698.