From b8376bc2f3355f52988b08dcef492ba41cd1fcb8 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com>
Date: Tue, 26 May 2026 12:25:31 +0200
Subject: [PATCH] fix: stabilize generated Open Graph images

Install system fonts in the Docker build and configure Resvg to load them so generated OG images render text reliably. Also emit absolute OG image URLs in route metadata.
---
 Dockerfile           | 3 ++-
 scripts/postbuild.ts | 7 ++++++-
 src/routes/$.tsx     | 2 +-
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index 5287f14d..e6f0cbbd 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -5,7 +5,8 @@ ARG VITE_ANALYTICS_DOMAIN=coolify.io/docs
 ARG VITE_SITE_URL=https://coolify.io/docs/
 ENV VITE_ANALYTICS_DOMAIN=${VITE_ANALYTICS_DOMAIN}
 ENV VITE_SITE_URL=${VITE_SITE_URL}
-RUN apk add --no-cache nodejs npm
+RUN apk add --no-cache nodejs npm fontconfig ttf-dejavu font-noto font-noto-emoji
+RUN fc-cache -f
 
 # Set working directory and copy necessary files
 WORKDIR /app
diff --git a/scripts/postbuild.ts b/scripts/postbuild.ts
index 5320f5a0..bc8aa316 100644
--- a/scripts/postbuild.ts
+++ b/scripts/postbuild.ts
@@ -119,7 +119,12 @@ async function writeOgImages() {
       await mkdir(dirname(outputPath), { recursive: true });
 
       const svg = renderOgSvg(doc.title, doc.description, logoDataUri);
-      const png = new Resvg(svg).render().asPng();
+      const png = new Resvg(svg, {
+        font: {
+          loadSystemFonts: true,
+          defaultFontFamily: 'DejaVu Sans',
+        },
+      }).render().asPng();
 
       await writeFile(outputPath, png);
     }),
diff --git a/src/routes/$.tsx b/src/routes/$.tsx
index 06763b4f..a11f04e0 100644
--- a/src/routes/$.tsx
+++ b/src/routes/$.tsx
@@ -63,7 +63,7 @@ export const Route = createFileRoute('/$')({
     const title = data.isIndex ? site.title : `${data.title} | ${site.title}`;
     const description = data.description || site.description;
     const canonicalUrl = absoluteUrl(data.url.endsWith('/') ? data.url : `${data.url}`);
-    const ogImageUrl = data.ogImagePath;
+    const ogImageUrl = absoluteUrl(data.ogImagePath);
     const structuredData = {
       '@context': 'https://schema.org',
       '@type': data.isIndex ? 'WebPage' : 'TechArticle',