fixing-metadata — Claude Code skill: audit and fix HTML metadata
Audits page metadata and fixes what's broken: titles, descriptions, canonical URLs, Open Graph, Twitter cards, icons and JSON-LD.
npx skills add ibelick/ui-skills --skill fixing-metadata -a claude-codeWhat fixing-metadata does
The skill walks your pages and looks for missing or wrong metadata: title, description, canonical, OG tags. It then checks them against priority rules, starting with duplicates and indexing problems before anything cosmetic. It also makes sure title, description, canonical and og:url agree with each other.
Inside is a five-step workflow plus a rule reference split into eight categories: correctness and duplication, title and description, canonical and indexing, social cards, icons and manifest, structured data, locale and alternates, tool boundaries. Social images have to use absolute URLs, and twitter:card is set to summary_large_image. JSON-LD gets added only when it maps to what the page actually renders.
Diffs stay small. The skill won't refactor unrelated code or swap your framework, and it follows whatever metadata pattern the project already uses — the Next.js metadata API, react-helmet, or a hand-written <head>. Social cards are meant to be checked on a real URL, so localhost won't tell you much.
What it helps with
- find pages with no title or meta description
- strip duplicate canonical and robots tags
- fix broken link previews on social platforms
- set absolute URLs for og:image
- match og:url against the canonical URL
Example prompts for the agent
- audit the metadata on the blog pages and fix duplicate canonicals
- the homepage social card shows a broken image — sort out og:image
- add proper Open Graph and Twitter tags for the new landing page
How to install fixing-metadata
1Skills CLI (Vercel)
npx skills add ibelick/ui-skills --skill fixing-metadata -a claude-code2Manually: put the files in place
~/.claude/skills/fixing-metadata/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/fixing-metadata/
1Skills CLI (Vercel)
npx skills add ibelick/ui-skills --skill fixing-metadata -a codex2Manually: put the files in place
.agents/skills/fixing-metadata/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add ibelick/ui-skills --skill fixing-metadata -a cursor2Manually: put the files in place
.cursor/skills/fixing-metadata/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install ibelick/ui-skills fixing-metadata2Manually: put the files in place
.github/skills/fixing-metadata/SKILL.md1Skills CLI (Vercel)
npx skills add ibelick/ui-skills --skill fixing-metadata -a gemini-cli2Platform CLI
gemini skills install https://github.com/ibelick/ui-skills --path skills/fixing-metadataManually: put the files in place
.devin/skills/fixing-metadata/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add ibelick/ui-skills --skill fixing-metadata -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
From the same set5
The whole set →Similar
Questions about fixing-metadata
How do I install fixing-metadata in Claude?
Run npx skills add ibelick/ui-skills --skill fixing-metadata -a claude-code. The skill lands at ~/.claude/skills/fixing-metadata/SKILL.md.
What does fixing-metadata do?
It audits HTML metadata and fixes what it finds: titles, descriptions, canonical URLs, Open Graph, Twitter cards, favicons, JSON-LD and robots directives.
How is fixing-metadata different from an SEO plugin?
It doesn't migrate frameworks or touch unrelated code, and it follows the metadata pattern already in your project. Changes stay scoped to metadata.
Source text
SKILL.md · MIT
--- name: fixing-metadata description: > Audit and fix HTML metadata including page titles, meta descriptions, canonical URLs, Open Graph tags, Twitter cards, favicons, JSON-LD structured data, and robots directives. Use when adding SEO metadata, fixing social share previews, reviewing Open Graph tags, setting up canonical URLs, or shipping new pages that need correct meta tags. version: 1.0.1 license: MIT --- ## Workflow 1. Identify pages with missing or incorrect metadata (titles, descriptions, canonical, OG tags) 2. Audit against the priority rules below — fix critical issues (duplicates, indexing) first 3. Ensure title, description, canonical, and og:url all agree with each other 4. Verify social cards render correctly on a real URL, not localhost 5. Keep diffs minimal and scoped to metadata only — do not refactor unrelated code ## when to apply Reference these guidelines when: - adding or changing page titles, descriptions, canonical, robots - implementing Open Graph or Twitter card metadata - setting favicons, app icons, manifest, theme-color - building shared SEO components or layout metadata defaults - adding structured data (JSON-LD) - changing locale, alternate languages, or canonical routing - shipping new pages, marketing pages, or shareable links ## rule categories by priority | priority | category | impact | |----------|----------|--------| | 1 | correctness and duplication | critical | | 2 | title and description | high | | 3 | canonical and indexing | high | | 4 | social cards | high | | 5 | icons and manifest | medium | | 6 | structured data | medium | | 7 | locale and alternates | low-medium | | 8 | tool boundaries | critical | ## quick reference ### 1. correctness and duplication (critical) - define metadata in one place per page, avoid competing systems - do not emit duplicate title, description, canonical, or robots tags - metadata must be deterministic, no random or unstable values - escape and sanitize any user-generated or dynamic strings - every page must have safe defaults for title and description ### 2. title and description (high) - every page must have a title - use a consistent title format across the site - keep titles short and readable, avoid stuffing - shareable or searchable pages should have a meta description - descriptions must be plain text, no markdown or quote spam ### 3. canonical and indexing (high) - canonical must point to the preferred URL for the page - use noindex only for private, duplicate, or non-public pages - robots meta must match actual access intent - previews or staging pages should be noindex by default when possible - paginated pages must have correct canonical behavior ### 4. social cards (high) - shareable pages must set Open Graph title, description, and image - Open Graph and Twitter images must use absolute URLs - prefer correct image dimensions and stable aspect ratios - og:url must match the canonical URL - use a sensible og:type, usually website or article - set twitter:card appropriately, summary_large_image by default ### 5. icons and manifest (medium) - include at least one favicon that works across browsers - include apple-touch-icon when relevant - manifest must be valid and referenced when used - set theme-color intentionally to avoid mismatched UI chrome - icon paths should be stable and cacheable ### 6. structured data (medium) - do not add JSON-LD unless it clearly maps to real page content - JSON-LD must be valid and reflect what is actually rendered - do not invent ratings, reviews, prices, or organization details - prefer one structured data block per page unless required ### 7. locale and alternates (low-medium) - set the html lang attribute correctly - set og:locale when localization exists - add hreflang alternates only when pages truly exist - localized pages must canonicalize correctly per locale ### 8. tool boundaries (critical) - prefer minimal changes, do not refactor unrelated code - do not migrate frameworks or SEO libraries unless requested - follow the project's existing metadata pattern (Next.js metadata API, react-helmet, manual head, etc.) ## review guidance - fix critical issues first (duplicates, canonical, indexing) - ensure title, description, canonical, and og:url agree - verify social cards on a real URL, not localhost - prefer stable, boring metadata over clever or dynamic - keep diffs minimal and scoped to metadata only
© ibelick · MIT · ibelick/ui-skills