Caching for css content for iphone FB APP - iphone

I'm trying to create a webpage for the iphone FB app wall link . When I try to use margin attribute on a div for the webpage, the margin attribute doesn't take affect when clicking on the wall link. If I view the same page in safari iphone browser the margin does take affect. It seems like it has to do with extra caching by Facebook of the CSS file. When I change the background color in the css file, the changes get propogated everywhere but inside the FB web browser on the iphone app.

found that FB wall post does some extra caching. to remove the caching, just pointed the css file to another file first, then switched it back after reloading the link from the wall post.

Related

My Facebook App's icon isn't appearing when sharing

I have a Facebook App (Page Tab, Website and Canvas) and since it's gone live I've updated the App Icon (1024x1024) but whenever someone shares the Canvas URL you still this:
How can I update this icon from Facebook's default image?
As I say, I've already updated the App Icon on the App Details page (https://developers.facebook.com/apps/XXX/app-details/). Is there somewhere else that I need to update the Canvas icon?
The answer was simple, and had nothing to do with the App Icon. Even though the user is sharing the Canvas URL, Facebook constructs the share data like it does for any website.
The issue was merely caching. I ran the Canvas URL through the Object Debugger (previous known as Linter) and it worked fine.
https://developers.facebook.com/tools/debug/og/object/
Simple!

Facebook ui share method displays small thumbs when shared from mobile

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.

Facebook Tab App Sharing issue with Image

I'm having issues when a user tries to share the URL to a Facebook tab app that I have setup.
When they paste the URL to the tab in their share window and then post their status update, the tab image is shown when viewed on their profile, however there is no image shown on the newsfeed version of the same post.
I've tried adding open graph meta tags to the app, but I believe that it is being ignored since it is located inside of the iframe, and the facebook open graph meta overrides it.
Does anyone know how to ensure an image is maintained when the tab URL is shared directly?
I've burnt a lot of time trying to solve this issue as well. The best I've come up with is that Facebook is going to chose to display the 111x74 app icon. Sharing this on a page's news feed makes it very pixelated and oddly offset, as it should be using a 1200x630 minimum image size, as dictated by the OG tag best practices, but Facebook has not allowed us to have that option in the app configs. It may be that your app icon is being offset enough to not appear like it's visible in the news feed.
So, from my research, we're out of luck until Facebook decides to fix this issue. Until that time, I don't think it's even worth trying to get the any image to work.
Someone feel free to prove me wrong.

Facebook Page Tab/Facebook Canvas App/Fan Page

This all sounds confusing;
I have a Facebook Canvas App with the same name as the Fan Page. I would like to add an iFrame tab to the Fan Page to promote and link to the Canvas App. My question is do I have to create a new app for the iFrame tab, or do I open my app settings for the canvas app and add settings for a page tab as well in there. Facebook don;t seem to have much documentation and they are changing things for app profiles soon, so I want to make sure I keep my fans of the page.
Thanks in advance.
Basically it goes like this.
You have an iFrame app.
The iFrame app has a canvas which is where you load your html for your app from your webserver with whatever language you want (.NET, PHP etc)
Then you can add this iFrame app to your page.
When you go to http://apps.facebook.com/yourappname
You will be shown the app by itself. When you add it to your page and load it via the tab on the menu of your page it will show you the app within the space on your page (an iframe).
You can use code to detect whether you are on a page or not to display different things.

Facebook canvas restraints and lightbox or modal

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.