| ... | ... | @@ -1,7 +1,7 @@ |
| 1 | 1 | --- |
| 2 | 2 | import { getImage, Image } from "astro:assets"; |
| 3 | 3 | import appIcon from "../assets/icon.webp"; |
| 4 | | import desktopScreenshot from "../assets/app-desktop.webp"; |
| 4 | import socialCard from "../assets/social-card.webp"; |
| 5 | 5 | import dmSansLatinUrl from "../assets/fonts/dm-sans-latin.woff2?url"; |
| 6 | 6 | import "../styles/fonts.css"; |
| 7 | 7 | import { |
| ... | ... | @@ -23,19 +23,19 @@ const { |
| 23 | 23 | pageClass, |
| 24 | 24 | } = Astro.props; |
| 25 | 25 | |
| 26 | | // Social preview card. Link unfurlers (Instagram, iMessage, X, Slack) want a |
| 27 | | // 1200x630 jpg or png at an absolute URL. Built from the hero screenshot so it |
| 28 | | // stays in sync with the homepage. |
| 26 | // Social preview card, shared by og:image and twitter:image. Link unfurlers |
| 27 | // (Instagram, iMessage, X, Slack) want a 1200x630 jpg or png at an absolute URL. |
| 28 | // The source is a 2x export so the downscale stays sharp. |
| 29 | 29 | const socialImage = await getImage({ |
| 30 | | src: desktopScreenshot, |
| 30 | src: socialCard, |
| 31 | 31 | width: 1200, |
| 32 | 32 | height: 630, |
| 33 | | fit: "cover", |
| 34 | | position: "top", |
| 35 | 33 | format: "jpg", |
| 36 | 34 | quality: 90, |
| 37 | 35 | }); |
| 38 | 36 | const socialImageUrl = new URL(socialImage.src, Astro.site); |
| 37 | const socialImageAlt = |
| 38 | "T3 Code: the open-source control plane for coding agents, with Claude Code, Codex, Cursor, OpenCode, Grok and Antigravity."; |
| 39 | 39 | const canonicalUrl = new URL(Astro.url.pathname, Astro.site); |
| 40 | 40 | --- |
| 41 | 41 | |
| ... | ... | @@ -53,12 +53,13 @@ const canonicalUrl = new URL(Astro.url.pathname, Astro.site); |
| 53 | 53 | <meta property="og:image" content={socialImageUrl} /> |
| 54 | 54 | <meta property="og:image:width" content="1200" /> |
| 55 | 55 | <meta property="og:image:height" content="630" /> |
| 56 | | <meta property="og:image:alt" content="The T3 Code desktop app with a thread open." /> |
| 56 | <meta property="og:image:alt" content={socialImageAlt} /> |
| 57 | 57 | <meta name="twitter:card" content="summary_large_image" /> |
| 58 | 58 | <meta name="twitter:site" content="@t3dotgg" /> |
| 59 | 59 | <meta name="twitter:title" content={title} /> |
| 60 | 60 | <meta name="twitter:description" content={description} /> |
| 61 | 61 | <meta name="twitter:image" content={socialImageUrl} /> |
| 62 | <meta name="twitter:image:alt" content={socialImageAlt} /> |
| 62 | 63 | <link |
| 63 | 64 | rel="preload" |
| 64 | 65 | href={dmSansLatinUrl} |