feat(docs): shared og:image + per-page og:title from H1#269
Merged
Conversation
- og:image: switch from `logo-full.svg` (subsite-local SVG) to `/og-image.png` — the shared social card used across fontist.org and all subsites. PNG renders reliably on Twitter/Facebook/LinkedIn; SVG does not. - transformHead: fall back to `pageData.title` (VitePress's resolved title = frontmatter.title || first H1) instead of only `frontmatter.title`. Most formulas pages (guide, browse) have no frontmatter title, so the previous fallback hardcoded "Fontist Formulas" on every page. Now og:title reflects the actual page — e.g. "Fontist Formulas Guide", "Mitimasu - Fontist Formula".
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Two small SEO consistency fixes for the formulas subsite, aligning it with fontist.org and the other subsites.
Changes
1.
og:image→ shared PNGhttps://www.fontist.org/formulas/logo-full.svg→https://www.fontist.org/og-image.pngThe SVG was subsite-local and SVG has poor support on Twitter/Facebook/LinkedIn. The PNG is the shared social card already used across fontist.org, fontist, and fontisan.
2. Per-page
og:titlefrom H1 (not just frontmatter)transformHeadwas usingpageData.frontmatter.title || "Fontist Formulas". Most formulas pages (guide, browse, formula pages) have no frontmatter title, so every page showed the site-wide"Fontist Formulas"as itsog:title.Changed the fallback to
pageData.title— VitePress's resolved title (frontmatter.title || first H1). Nowog:titlereflects the actual page./guide//browse/<formula>/Verification (local build, prod env)
BASE_PATH=/formulas/ SITE_URL=https://www.fontist.org npm run build→ 4323 pages built. Confirmed indist:dist/guide/index.html:og:title="Fontist Formulas Guide",og:image="https://www.fontist.org/og-image.png",og:url="https://www.fontist.org/formulas/guide/".dist/index.html:og:image="https://www.fontist.org/og-image.png".og:title="Mitimasu - Fontist Formula".Scope
Two-line change to
docs/.vitepress/config.ts. No routing, build, or content changes — formulas already had directory-style URLs, sitemap, andtransformHead; this just corrects theog:imagesource and theog:titlefallback.