I have a bot that is running on both Skype and Facebook, hero and thumbnail cards sent to Skype appear as expected but on Facebook the image is stretched and scaled to fit the size of the card.
How can i stop Facebook doing this as its undesirable?
For Facebook messenger there are 2 sizes possible. 'Horizontal' which has a 1.91:1 ratio and 'Square' which has a 1:1 ratio. The 'Horizontal' option is the default value.
When creating a Hero or thumbnail card using the classes provided in the framework this value can not be set. If you want to set this value you will have to implement your own model and pass your own json back.
Check out the documentation for Facebook here.
Related
I do not know why, but I have two Facebook pixel codes on my site. Facebook Pixel Helper shows that the first code is the one I inserted on my site and is responsible for collecting information about PageView. The second FB code has no ID, and the pixel code can not be displayed (because it does not exist). Below screen, how it looks:
Is it normal?
Facebook uses Facebook Pixel everywhere. So this might be from any Facebook widget, Like widget, Embedded Post or any other Facebook Component within your page.
This is normal and will not affect your Pixel.
I'm using FB.ui share method to share links on Facebook.I have to use this method since I want to tag friends on my post.
window.open(
'https://www.facebook.com/v2.1/dialog/share?app_id=&display=popup&redirect_uri='+encodeURIComponent(REDIRECT_URL)+'url='+encodeURIComponent(SHARE_LINK),
'facebook-share-dialog',
'width=750,height=393');
Even though my og:image has the right size, i.e 1200x630px when shared on Facebook the shared link is displayed with small thumb.
When I change the method to FEED dialog or SHARE using facebook/...//sharer.php URL large thumb is shown for the shared link on Facebook.
window.open(
'https://www.facebook.com/v2.2/dialog/feed?app_id=&display=popup&redirect_uri='+encodeURIComponent(REDIRECT_URL)+'&link='+encodeURIComponent(''),
'facebook-share-dialog',
'width=750,height=393');
return false;"
IS there any additional parameter that I need to add TO https://www.facebook.com/v2.1/dialog/share so my image is displayed correctly I.E with large thumb on Facebook?
Thanks.
I had the exactly same issue. I was using "/sharer/sharer" for sharing links and everything was working well. And when I try to use the "/v2.1//dialog/share" I noticed that on desktop, images are big (1200 width) but on mobile (web and iOS App), the share is displayed as a small square.
I think it is because when you use "/v2.1/dialog/share", Facebook assume you share a story through your Facebook App and on mobile UI, story are displayed with small square image :-(
When you use the /sharer/sharer, there is no association with your app and Facebook will just assume user share a link in his feed. And it is the only type of share that display large image on all platform (desktop, mobile and iOS app)
So basically I don't think you can force FB to display large image :-(.
The Facebook doc say that providing big image will result in big image display but it looks like it is only the case for desktop. And for mobile only link status are displayed as big image.
We have a PHP based real estate template and when we SHARE PAGE on Facebook, the resulting photos to choose from do not include the desired photo(s) to select from. IE we have 10-15 images on this page, and facebook only offers 3-4 as an option to share, none of which we want to share.
Suggestions?
Example http://kemptvillerealestate.com/listings/listing_body.php?id=118521
I have seen some cases that image size and/or aspect ratio did not satisfy Facebook's requirement and those images did not appear on users' wall, timeline or Facebook page.
The best practice is shown here and I think this is the latest one. As Facebook design including timeline, news feed and page changes this optimization practice changes accordingly. So be careful catching up the latest specifications.
So far the document describes as follows:
Use images that are at least 1200 x 630 pixels for the best display on high resolution devices. At the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images.
If your image is smaller than 600 x 315 px, it will still display in the link page post, but the size will be much smaller.
We've also redesigned link page posts so that the aspect ratio for images is the same across desktop and mobile News Feed. Try to keep your images as close to 1.91:1 aspect ratio as possible to display the full image in News Feed without any cropping.
And when you update images on your pages, make sure you visit Facebook Debugger and let Facebook crawler scrape your page again so they will get the latest version of your page content. Or you can do it programmatically as stated here:
This Graph API endpoint is simply a call to:
POST /?id={object-instance-id or object-url}&scrape=true
The response from this endpoint will be a JSON object that contains all the information about the object that was scraped (the same data returned when the Object ID is read from the Graph API).
I'm trying to post a message on my wall via facebook graph api. I set a picture parameter (an external url) and a message parameter. The message itself contains a link. When the item gets posted to the feed, however, an image is shown as a very small thumbnail and there's a link to my website next to it (on the right). What i want to do instead is to make the thumbnail appear full width on the post (like when you post via facebook itself). I don't set the link to my website anywhere, only picture url and message parameters are set - so where is it comming from and is there a way to remove it and make the picture appear right below the message, taking full width of the post?
Thank you for your answers
To display a picture with full width, your picture size must be in 1200x630 for best display on high resolution device.
Facebook sharing best practice
I'm developing an application for Facebook and would like to use a lightbox or modal to display contents larger than the permitted canvas area (560). I don't have much experience with Facebook app development. The research I have completed has given me very little information regarding the issue. Loading a lightbox is fine it is making the the lightbox wider than the viewing area that is the problem.
In order to do this, you would need to be able to access the parent element from inside the iframe but because the content is from 2 different domains (parent content on Facebook server, iframe content on your server) cross domain restrictions apply and you will not be able to. So you will only be able to pop it up inside the 560 width iframe facebook gives you.
I also tried to achieve what you want, but I didn't get success because application called in facebook using iframe. And so that the effect of lightbox,modal or shadow have limited to that iframe width and height.
Simply, I am on conclusion is that the lightbox have not same effect which in normal websites.
In facebook it's limited to only canvas only.