OpenParable
Skip to content
← Back to skills

Og Tags

Business
og-tags

Og Tags is an Agent Skill for business published in the thedaviddias/Front-End-Checklist repository on GitHub: a SKILL.md instruction file an AI agent can load to do this task.

Use when auditing a web page's social sharing metadata. Applies to any page users might share on social networks or messaging apps.

View on GitHub ↗
QUICK START

How to use this skill

Bring this guide into your coding agent with a prompt tailored to the tool you use.

  1. Open your project in Codex.
  2. Copy and paste the prompt below.
  3. Review files and risks before approving any action.
Prompt to paste
Inspect the Agent Skill at https://github.com/thedaviddias/Front-End-Checklist/blob/HEAD/skills/og-tags/SKILL.md and all supporting files. Report provenance, permissions, scripts, dependencies, and security risks. Propose an exact installation into .agents/skills/og-tags, but wait for my approval before writing files or running scripts.

Copying this prompt does not install or run the skill. Review third-party files before use.

Open Graph Tags

Open Graph tags control how your pages appear when shared on Facebook, LinkedIn, Slack, and other platforms—missing or incorrect tags result in unappealing link previews that reduce click-through rates.

Quick Reference

  • Include og:title, og:description, og:image, and og:url on every page
  • Use absolute URLs for og:image and og:url
  • og:image should be at least 1200×630 px for optimal display
  • og:type defaults to 'website' if omitted, but setting it explicitly is best practice

Check

Check the for Open Graph meta tags: og:title, og:description, og:image, og:url, and og:type. Verify all values are non-empty and og:image/og:url use absolute HTTPS URLs.

Fix

Add the four required Open Graph meta tags to the : og:title (≤95 chars), og:description (≤200 chars), og:image (absolute HTTPS URL, 1200×630), og:url (canonical absolute URL). Add og:type='website' for standard pages.

Explain

Open Graph tags control how this page is displayed when shared on social platforms like Facebook, LinkedIn, and Slack. Without them, platforms fall back to guessing the title, description, and image, often with poor results.

Code Review

Check the rendered for all five core OG properties: og:title, og:description, og:image, og:url, og:type. Verify og:image and og:url values start with 'https://'. Flag any empty content attributes. Compare og:url against the canonical tag — they must match exactly.


For full implementation details, code examples, and framework-specific guidance, see references/rule.md.

Rule page: https://frontendchecklist.io/en/rules/seo/og-tags