How-To
Beginner
1 min read
233 words
Open Graph and Twitter Card Setup for Social Sharing
When someone shares your URL on social media, Open Graph and Twitter Card tags determine the title, description, and image that appear. Optimizing these tags increases engagement and click-through rates.
Key Takeaways
- Open Graph (OG) was created by Facebook and is now used by LinkedIn, Pinterest, Discord, Slack, and most messaging apps.
- Twitter supports two main card types:
- Facebook**: Use the Sharing Debugger to preview and refresh cached OG data
- Relative image URLs (must be absolute with https://)
- ## Open Graph Essentials Open Graph (OG) was created by Facebook and is now used by LinkedIn, Pinterest, Discord, Slack, and most messaging apps.
Featured Tool
Social Character Counter
Count characters against platform limits
Open Graph Essentials
Open Graph (OG) was created by Facebook and is now used by LinkedIn, Pinterest, Discord, Slack, and most messaging apps.
Required Tags
Image Specifications
| Platform | Recommended Size | Aspect Ratio |
|---|---|---|
| 1200 × 630 | 1.91:1 | |
| 1200 × 627 | 1.91:1 | |
| Twitter (large) | 1200 × 628 | ~2:1 |
| Discord | 1200 × 630 | 1.91:1 |
A 1200 × 630 image works well across all platforms. Keep important content within the center 80% to avoid cropping on different aspect ratios.
Twitter Card Tags
Twitter supports two main card types:
- summary: Small square image with title and description (good for articles)
- summary_large_image: Full-width image above title (good for visual content)
Debugging
- Facebook: Use the Sharing Debugger to preview and refresh cached OG data
- Twitter: Use the Card Validator to preview
- LinkedIn: Use the Post Inspector
Common Mistakes
- Relative image URLs (must be absolute with https://)
- Images smaller than 200×200 (minimum for most platforms)
- Missing og:url causing duplicate content signals
- Not updating cached OG data after changes (platforms cache aggressively)