From 532e515b5586f4b5dce1f95795fe840e28b4273a Mon Sep 17 00:00:00 2001
From: Ian Hunt-Isaak <ianhuntisaak@gmail.com>
Date: 2025年10月29日 15:49:02 -0400
Subject: [PATCH 1/3] fix open graph url verification + add more info
---
 src/components/layout.js &#124; 27 ++++++++++++++++++++++++++-
 src/pages/blog/[id].js &#124; 5 +++++
 2 files changed, 31 insertions(+), 1 deletion(-)
diff --git a/src/components/layout.js b/src/components/layout.js
index aa216cfd0..3dab32415 100644
--- a/src/components/layout.js
+++ b/src/components/layout.js
@@ -12,6 +12,11 @@ export const Layout = ({
 children,
 url = 'https://xarray.dev',
 enableBanner = false,
+ type = 'website',
+ imageWidth,
+ imageHeight,
+ publishedTime,
+ authors,
 }) => {
 const bannerTitle = 'Check out the latest blog post:'
 // The first link will be the main description for the banner
@@ -41,6 +46,8 @@ export const Layout = ({
 
 // Construct the full card URL
 const fullCardUrl = card.startsWith('http') ? card : `${baseUrl}${card}`
+ // Construct the full URL for og:url
+ const fullUrl = url.startsWith('http') ? url : `${baseUrl}${url}`
 
 return (
 <strong>
@@ -50,12 +57,30 @@ export const Layout = ({
 <meta property='og:title' content={title} />
 <meta property='og:description' content={description} />
 <meta property='og:image' content={fullCardUrl} />
- <meta property='og:url' content={url} />
+ {imageWidth && <meta property='og:image:width' content={imageWidth} />}
+ {imageHeight && (
+ <meta property='og:image:height' content={imageHeight} />
+ )}
+ <meta property='og:url' content={fullUrl} />
+ <meta property='og:type' content={type} />
+ {type === 'article' && publishedTime && (
+ <meta property='article:published_time' content={publishedTime} />
+ )}
+ {type === 'article' &&
+ authors &&
+ authors.map((author) => (
+ <meta + key={author.github} + property='article:author' + content={`https://github.com/${author.github}`} + />
+ ))}
 <meta name='twitter:title' content={title} />
 <meta name='twitter:description' content={description} />
 <meta name='twitter:image' content={fullCardUrl} />
 <meta name='twitter:card' content='summary_large_image' />
 <meta name='twitter:site' content='@xarray_dev' />
+ <link rel='canonical' href="/index.cgi/larger-text/https://patch-diff.githubusercontent.com/raw/xarray-contrib/xarray.dev/pull/{fullUrl}" />
 <link rel='icon' type='image/png' diff --git a/src/pages/blog/[id].js b/src/pages/blog/[id].js index ce077d9ac..80acaca78 100644 --- a/src/pages/blog/[id].js +++ b/src/pages/blog/[id].js @@ -38,6 +38,11 @@ export default function Post({ source, frontmatter, postId }) { card={`/cards/${postId}.png`} description={frontmatter.summary} url={`/blog/${postId}`} + type='article' + image + imageHeight='1440' + publishedTime={date.toISOString()} + authors={frontmatter.authors}>
 <box as={'section'}>
 <container maxW='container.lg' py={10}>
From a5fc6248ef5f80f66d67870c6811720e065461dc Mon Sep 17 00:00:00 2001
From: Ian Hunt-Isaak <ianhuntisaak@gmail.com>
Date: 2025年10月29日 15:53:36 -0400
Subject: [PATCH 2/3] differentiate canonical URL on PR previews
---
 src/components/layout.js &#124; 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)
diff --git a/src/components/layout.js b/src/components/layout.js
index 3dab32415..7dd1750b2 100644
--- a/src/components/layout.js
+++ b/src/components/layout.js
@@ -44,9 +44,15 @@ export const Layout = ({
 ? process.env.NEXT_PUBLIC_SITE_URL
 : process.env.URL &#124;&#124; 'http://localhost:3000'
 
+ // Canonical URL always points to production for SEO
+ const canonicalBaseUrl = 'https://xarray.dev'
+ const canonicalUrl = url.startsWith('http')
+ ? url
+ : `${canonicalBaseUrl}${url}`
+
 // Construct the full card URL
 const fullCardUrl = card.startsWith('http') ? card : `${baseUrl}${card}`
- // Construct the full URL for og:url
+ // Construct the full URL for og:url (can use preview URL)
 const fullUrl = url.startsWith('http') ? url : `${baseUrl}${url}`
 
 return (
@@ -80,7 +86,7 @@ export const Layout = ({
 <meta name='twitter:image' content={fullCardUrl} />
 <meta name='twitter:card' content='summary_large_image' />
 <meta name='twitter:site' content='@xarray_dev' />
- <link rel='canonical' href="/index.cgi/larger-text/https://patch-diff.githubusercontent.com/raw/xarray-contrib/xarray.dev/pull/{fullUrl}" />
+ <link rel='canonical' href="/index.cgi/larger-text/https://patch-diff.githubusercontent.com/raw/xarray-contrib/xarray.dev/pull/{canonicalUrl}" />
 <link rel='icon' type='image/png' From 85227210ed4ee3f17bd669f8a4391e9b8bb984a9 Mon Sep 17 00:00:00 2001 From: Ian Hunt-Isaak <ianhuntisaak@gmail.com>
Date: 2025年10月29日 16:00:54 -0400
Subject: [PATCH 3/3] maybe fix open graph images?
---
 netlify.toml &#124; 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)
diff --git a/netlify.toml b/netlify.toml
index 209622093..f14fd21e1 100644
--- a/netlify.toml
+++ b/netlify.toml
@@ -18,15 +18,11 @@
 status = 404
 
 # Environment variables for different deploy contexts
+# Note: Netlify automatically provides URL and DEPLOY_PRIME_URL
+# We don't need to set NEXT_PUBLIC_SITE_URL for previews since our code falls back to process.env.URL
 [context.production.environment]
 NEXT_PUBLIC_SITE_URL = "https://xarray.dev"
 
-[context.deploy-preview.environment]
- NEXT_PUBLIC_SITE_URL = "$DEPLOY_PRIME_URL"
-
-[context.branch-deploy.environment]
- NEXT_PUBLIC_SITE_URL = "$DEPLOY_PRIME_URL"
-
 # Headers for security
 [[headers]]
 for = "/*"
</div><div class="naked_ctrl">
<form action="/index.cgi/larger-text" method="get" name="gate">
<p><a href="http://altstyle.alfasado.net">AltStyle</a> によって変換されたページ <a href="https://patch-diff.githubusercontent.com/raw/xarray-contrib/xarray.dev/pull/815.patch">(-&gt;オリジナル)</a>
/ <label>アドレス: <input type="text" name="naked_post_url" value="https://patch-diff.githubusercontent.com/raw/xarray-contrib/xarray.dev/pull/815.patch" size="22" /></label> <label>モード: <select name="naked_post_mode">
<option value="default">デフォルト</option>
<option value="speech">音声ブラウザ</option>
<option value="ruby">ルビ付き</option>
<option value="contrast">配色反転</option>
<option value="larger-text" selected="selected">文字拡大</option>
<option value="mobile">モバイル</option>
</select>
<input type="submit" value="表示" />
</p>
</form>
</div>