Open Graph Image Specification

Required Image: `og-share-card.png`

Create this image and place it at: https://mealmood.app/images/og-share-card.png

Dimensions

Size: 1200 x 630 pixels (Facebook/LinkedIn optimal)
Format: PNG or JPG
File size: Under 1MB recommended

Design Recommendations

+----------------------------------------------------------+
|                                                          |
|     [App Icon]                                           |
|                                                          |
|     MealMood                                    |
|     ─────────────────                                    |
|                                                          |
|     Plan your family meals in minutes                    |
|     with less stress and more variety.                   |
|                                                          |
|     [Progress bar illustration]                          |
|                                                          |
|     ★ Drag & Drop  ★ Smart Auto-complete                |
|     ★ Calendar Sync  ★ Privacy Focused                  |
|                                                          |
|                    [App Store Badge]                     |
|                                                          |
+----------------------------------------------------------+

Color Scheme

Background: Gradient from #667eea to #764ba2 (match your app branding)
Text: White
Accent: Your app's accent color

Elements to Include

App icon (prominent, top-left or center)
App name "MealMood"
Tagline or value proposition
Visual element (progress bar, chart icon, or screenshot)
Feature highlights
App Store badge (optional)

Tools to Create

Figma (free template available)
Canva
Adobe Illustrator/Photoshop

Testing Your OG Tags

After deploying, test with these tools:

Facebook: https://developers.facebook.com/tools/debug/
Twitter: https://cards-dev.twitter.com/validator
LinkedIn: https://www.linkedin.com/post-inspector/
General: https://www.opengraph.xyz/

Files to Deploy

/share/index.html (or configure your server to serve share.html at /share)
/images/og-share-card.png
/images/app-icon.png (your app icon, 120x120 or larger)

Apple Smart App Banner

The HTML includes this meta tag:

<meta name="apple-itunes-app" content="app-id=6759255553">

This shows a smart banner on iOS Safari prompting users to download your app.

2.6 KiB Raw Permalink Blame History