From ee15e27265cb76e947068789423f6d8670cf653f Mon Sep 17 00:00:00 2001
From: Ben Schlegel <ben5.schlegel@gmail.com>
Date: Fri, 22 Sep 2023 12:17:10 +0200
Subject: [PATCH] fix: og preview on discord

---
 quartz/components/Head.tsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/quartz/components/Head.tsx b/quartz/components/Head.tsx
index 19dca6f69..2a1bd46bd 100644
--- a/quartz/components/Head.tsx
+++ b/quartz/components/Head.tsx
@@ -73,8 +73,8 @@ async function generateSvg(
       />
     </div>,
     {
-      width: 1200,
-      height: 675,
+      width: ogHeight,
+      height: ogWidth,
       fonts: [
         {
           name: fontName,
@@ -97,6 +97,9 @@ async function generateSvg(
   fs.writeFileSync(`public/static/${filePath}.png`, pngBuffer)
 }
 
+const ogHeight = 1200
+const ogWidth = 676
+
 export default (() => {
   let font: Promise<ArrayBuffer | undefined>
   function Head({ cfg, fileData, externalResources }: QuartzComponentProps) {
@@ -136,6 +139,12 @@ export default (() => {
         <meta property="og:title" content={title} />
         <meta property="og:type" content="website" />
         <meta property="og:description" content={description} />
+        <meta property="og:image:type" content="image/png" />
+        <meta property="og:image:alt" content={fileData.description} />
+        <meta property="og:image:width" content={"" + ogWidth} />
+        <meta property="og:image:height" content={"" + ogHeight} />
+        <meta property="og:image:url" content={ogImagePathNew} />
+        <meta name="twitter:card" content="summary_large_image" />
         <meta name="twitter:title" content={title} />
         <meta name="twitter:description" content={description} />
         <meta property="twitter:url" content={`https://${cfg.baseUrl}/${fileData.slug}`}></meta>