Search code examples
htmlfacebook-opengraphwhatsappsocial-media

Open Graph tag for Whatsapp link sharing


I use Open Graph tags for sharing on social media. My image is 1200 x 630 pixels and works on Facebook and Whatsapp:

<meta property="og:image" content="https://emotionathletes.org/images/logo_1200x630_facebook_shared_image_EN.png">

On Facebook, the image appears OK, since it's made for it. On Whatsapp, the appears cropped, since seems to expect a square image.

Can I use a tag to provide an image for sharing only on Whatsapp?


Solution

  • You can specify two (or more) Open Graph images, the first, rectangular image for FB and a second, square image for WhatsApp.

    <meta property="og:image" content="https://emotionathletes.org/images/logo_1200x630_facebook_shared_image_EN.png">
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:image" content="https://emotionathletes.org/images/logo_400x400_facebook_shared_image_EN.png">
    <meta property="og:image:width" content="400" />
    <meta property="og:image:height" content="400" />
    

    WhatsApp will use the last image.