Menu
I'm trying to create a custom open graph story to Facebook but I'm having some trouble getting the og:image to show properly. I'm using a 1200*630 sized image as recommended here and here but on my timeline it gets cropped in to a square from the left edge of the image. It also shows as a square in the story preview though this time it's cropped from the center.
How can I get the image to show in the correct aspect ratio and size? Is it just the test environment to blame or do I need to add something on my server side? I've already tried to use the meta tags width and height with no success.
Currently the tag looks like this:
<meta property="og:image" content="http://www.linktomyimage/1200x630pixels.png" />
242
Optimizing the Image Size for Facebook Open Graph For the best display on high-resolution devices, the company suggests choosing an image that's at least 1200 x 630 pixels. If your image is smaller than 600 x 314 pixels, it'll still display in your post, but appear as a thumbnail-sized picture.
Open Graph Markup Without these Open Graph tags, the Facebook Crawler uses internal heuristics to make a best guess about the title, description, and preview image for your content. Designate this info explicitly with Open Graph tags to ensure the highest quality posts on Facebook.
You can set a custom og:image on a page by page basis. Just go to Page Settings > Social Image > Upload. If you need to add other OG tags and customize the default settings, go to Page Settings > Advanced > Page Header Code Injection. Read the following section on adding the tags manually and copy-paste the code there.
Open Graph Stories Images appear in a square format. Image ratios for these apps should be 600 x 600 px.
from Facebook sharing best practices
68
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
