FB OpenGraph og:image not pulling images (possibly https?)

Some properties can have extra metadata attached to them. These are specified in the same way as other metadata with property and content, but the property will have extra :

The og:image property has some optional structured properties:

  • og:image:url – Identical to og:image.
  • og:image:secure_url – An
    alternate url to use if the webpage requires HTTPS.
  • og:image:type – A
    MIME type for this image.
  • og:image:width – The number of pixels wide.
  • og:image:height – The number of pixels high.

A full image example:

<meta property="og:image" content="http://example.com/ogp.jpg" />
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" /> 
<meta property="og:image:type" content="image/jpeg" /> 
<meta property="og:image:width" content="400" /> 
<meta property="og:image:height" content="300" />

So you need to change og:image property for your HTTPS URLs to og:image:secure_url

Ex:

HTTPS META TAG FOR IMAGE:

<meta property="og:image:secure_url" content="https://www.[YOUR SITE].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />

HTTP META TAG FOR IMAGE:

<meta property="og:image" content="http://www.[YOUR SITE].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />

Source: http://ogp.me/#structured <– You can visit this site for more information.

Hope this helps you.

EDIT: Don’t forget to ping facebook servers after updating your codes – URL Linter

Leave a Comment