seo: add appropriate og tags for link sharing #460
Merged
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.
Solution implemented:
Enhanced the
transformHead
function in.vitepress/config/shared.ts
to dynamically add page-specific Open Graph and Twitter meta tags:og:title
andtwitter:title
based on page title (from frontmatter or page title)og:description
andtwitter:description
based on page description (from frontmatter, page description, or fallback)og:url
based on actual page URL with proper path constructionog:url
that incorrectly pointed to GitHubResults verified:
✅ Home page (
/
): Uses "The JavaScript Oxidation Compiler" and correct URL✅ Linter page (
/docs/guide/usage/linter.html
): Uses "Linter" title and correct URL✅ Branding page (
/branding.html
): Uses "Branding" title and correct URL✅ All pages now have proper page-specific URLs instead of generic GitHub link
✅ Linting passes with no issues
✅ Build completes successfully
When sharing sub-pages now, the link preview will show the correct page-specific title and URL, solving the SEO issue described.
Fixes #459.
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.