6

I am trying to create a custom story that has a new image every time someone tries to post it. Now I have created an Object, and Action and a Story combining the two. What I would like to achieve is a story that looks like this https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xpa1/t39.2178-6/851562_1376970469205025_523101852_n.png , yet all i seem to be getting is https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xpa1/t39.2178-6/851560_389589627833470_1903099476_n.png

Lets say my Object is course and my action is run. Below is the code I have the does not return the correct results. The image I am including is 1200 x 630.

    FB.api(
        'me/namespace:run',
        'post',
        {
            course  : {

                "og:type"       :   "namespace:course",
                "og:url"        :   "http://example.com",
                "og:title"      :   "Title",
                "og:description":   "Description",
                "fb:app_id"     :   "####",
                "og:image"      :   "http://example.com/chart.png"
            },
            distance    : 25.5,
            location    : "Sample location: Longitude",
            message     : "Special Caption Message"
        }

I also tried using the 'user_generated' image flag, it displayed the image at full story width however when you click on the image it does not link you back to the website but it opens up the image in the modal box ( like a gallery image ).

I am not sure if it's the code or not. Maybe some settings I am unaware of. Let me know if there is any more information I can provide to get a solution for this issue.

Vadim Kotov
  • 8,084
  • 8
  • 48
  • 62
Freecode
  • 147
  • 1
  • 10
  • Where are you looking to see the story? Facebook displays stories differently depending on where you look at them. For example on timelines, the large image is NEVER shown. Open up the individual post (by clicking the time posted) and you'll likely see the big image. – Chris Houghton Jul 30 '14 at 20:07
  • commenting because i've got the exact same question. – user3346601 Nov 12 '14 at 11:02
  • @Freecode I've answered your question with a solution that worked perfectly for the same problem you had. – David Ingledow May 03 '15 at 19:39
  • I'm having the same issue. @Freeocde, have you ever been able to resolve it? – Florian Nov 21 '16 at 12:26

2 Answers2

1

You need to specify a width and a height:

"og:image:width":  1200,
"og:image:height": 650

I haven't tried it with a 630px height, but it appears that it should work and may even be better with a value of 630. See Facebook content sharing best practices.

David Ingledow
  • 2,025
  • 4
  • 20
  • 36
  • 1
    doesn't work for me. My image size is 1200 x 628 = 1.91:1 as said in the docs. But i only see the `small` image on the left site. – Stone Jan 08 '16 at 09:52
  • This does not solve the issue because providing width and height only allows to render the image immediately without having to asynchronously download and process it. – Florian Nov 21 '16 at 12:25
0

Try to use an image with 1200X650 as stated instead of 1200X630. as stated on documentation images must keep aspect ratio.

Edan Feiles
  • 465
  • 4
  • 16