I'm attempting to add a FB "Like Box" to a website I'm developing. Not too familiar with Facebook apps, but so far I've gone the non-IFRAME route, using the FB SDK script include.
I'm fairly certain I've got almost everything setup correctly. In fact, I see the widget appear when I visit the page UNCACHED (i.e. in FF, I hit CTRL+SHIFT+R to reload all content to avoid loading from cache). Once I revisit the site, or move around within the site by clicking links, the content does not reappear.
I'm wondering if it's an issue with a) the channel.php file, or b) the apps interaction with my use of JQuery. The channel.php file is verbain what is provided by Facebook (using PHP's caching mechanism).
Here's the site currently: http://www.morningfatty.com/demo - It might be easier to list this rather than post several code snippets.
I went to your website and didn't see the like box. I checked the HTML code and it all appeared fine. The div looked like <div data-header="false" data-stream="false" data-border-color="#40ADAD" data-show-faces="true" data-colorscheme="light" data-width="192" data-href="http://www.facebook.com/morningfatty" class="fb-like-box"></div>
I went to https://developers.facebook.com/docs/reference/plugins/like-box/ and tried your link http://www.facebook.com/morningfatty and lo-and-behold the like box didn't display there.
I tried going directly to http://www.facebook.com/morningfatty and it redirected me to http://www.facebook.com/MorningFatty. I noticed the change of case in the name. So I went back and tried http://www.facebook.com/MorningFatty in the like-box and it worked!!.
I believe that you page will work once you update the casing on the url. :)
Related
I am using the iframe method to get the Facebook Like Box on my website.
The website is: http://motorcyclealley.co.nz (the Like Box should be showing down the bottom to the right of the YouTube video)
However, it is always blank.
Browsing to the iframe url in my browser: http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/MotorcycleAlley&width=320&height=315&show_faces=false&colorscheme=light&stream=true&border_color&header=false&appId=397375460320824
Also produces a blank screen. The url was generated with the official generator. I am unable to figure out what is wrong because STRANGELY it works in the browser I originally did it on (Firefox 18.0.2 on Linux).
I have tried it on Chrome, Internet Explorer and Firefox/Windows and made sure that all adblocking extensions are disabled. I still get the blank screen.
Can anyone tell me whats going on?
EDIT: I should also mention that I have tried the HTML5 and FBML methods with the same result, they both worked on that ONE browser but not on any others
Ok, I just found out why. The Like Box doesnt show unless you're logged into Facebook in that browser (because it is set to have an age restriction). Apparently the following fixes it: https://stackoverflow.com/a/9310091/335227
I had the same problem.
I followed FB's instruction to add a FB like box in my web page:
<div class="fb-like"
data-href="https://www.your-domain.com/your-page.html"
data-width=""
data-layout="standard"
data-action="like"
data-size="small"
data-share="true">
</div>
But the block doesn't show like and share buttons, only white blank.
After some investigation I found it to be a bug of standard layout, if I set data-layout attribute to box_count, button_count or button, it works well.
My research
I recently set up a Facebook page for my organization. Myself and the communications person at my organization have tried to set up a FB like box for my organization's website. When I go through the steps logged in as an organization page, it says I have to switch from using FB as a page to using it as a personal account. When I do that, and go through the steps again, the FB like box is generated correctly. When I take IFRAME text and generate it into HTML, it does not load, nothing shows up. I'm thinking that this is a permission issue or some else...not sure how to fix.
Are you removing the iFrame from the markup? This is an essential part of the like box, and it won't work without it. Seeing some of your markup vs their markup would be awesome. :)
Edit:
I can't tell what the difference is, because I don't have a diff tool handy right now, but here's a JS fiddle where yours doesn't work, and the code I regenerated based on yours does
work.
http://jsfiddle.net/XrSKx/
Basically i'd like to put a like button on the website so that fans of the site can like the websites Facebook page.
The Like button page doesn't give me the code when i click the button, just says "Only verified developers can be added as listed developers of this application. Read www.facebook.com/help/?faq=17580 for details." Is this a common error, or?
EDIT: Using Like box now, but would prefer Like button.
And the like box page gives me the iframe and XFBML codes. Sorry for being a n00b, but how do i add either one onto my site? I've tried Insert > Script and pasted it in there, using all four script types (Javascript, JS 1.1, JS 1.2 and VBScript but they don't show in the preview. Placed the code under the 'back to top' button at the bottom of the page. Not showing up when i look at code view of the online version though?
Hopefully its something really easy and obvious, but any help would be great.
Again, site is designed/updated with Dreamweaver MX 6.0.
I dont have that much experience with Dreamweaver - but implementing the facebook social plugins (eg. Like button) is very simple. All you have to do is copy and paste the XFMBL you generate from this link. Once you paste your URL into the "URL to Like" field and click "get code" you should get the correct code to use...
You place this code wherever you want it to appear - if you want the like button to be in the footer just paste it there...
The code snippet actually loads the facebook javascript sdk and places your like button inside an iframe on your page...
You can not place the like button code inside a different element - if that were possible people could trick you into liking their page by writing some different label on the button - eg. "Back to top" :)
This should be relatively simple to implement. If you are still having dificulties - why not try opening a new HTML file containing only the required HTML tags and the like button code...
Hope this helps!
Good luck!
The error appears because, just like it says in the message, you are not a verified developer.
In order to be a verified Facebook developer, you need a verified Facebook account, with a credit card or a phone number verification.
I'd suggest you verify your account as soon as you can if you plan to use more of Facebook's plugins and apps, since it will give you full access to their developer tools
I have a facebook like button on each of my wordpress blog posts, this worked fine up until about 2 weeks ago, and now all recent blog posts don't have functioning like buttons.
This is the response I get when I click the like button (post link)
for (;;);{"__ar":1,"payload":{"requires_login":false,"success":false,"already_connected":false,"is_admin":false,"show_error":false,"error_info":null}}
and for the old blog posts that DO work (post link):
for (;;);{"__ar":1,"payload":{"requires_login":false,"error_info":null,"show_error":false,"node_type":"ExternalLink","node_id":"xxxxxxxxxxxxxxxxx","edge_type":"ExternalLinkLike","connect_text":0,"success":true,"already_connected":true,"user_profile":{"name":"xxxxxxx","profile_url":"http:\/\/www.facebook.com\/xxxxxxx","pic_square":"http:\/\/profile.ak.fbcdn.net\/hprofile-ak-snc4\/xxxxxx_xxxxxxxxx_xxxxxxx_x.jpg"},"story_fbid":"xxxxxxxxxxxxxxxxx","is_admin":false,"admin_url":""},"invalidate_cache":[0]}
I've tried replacing the like box code, removing the href attribute from the like box tag, running each link through Facebook URL Linter and none of this has worked!
I don't understand why it works for old blog posts and not new ones, there are no differences between them (that I know of).
This issue has nothing to do with your code. It is a FB issue I encounter on my websites as well. Did some research and came up with this:
this behavior is intermittent, may work on some pages, may fail on others
if you go on this page: http://developers.facebook.com/tools/lint/ and enter your url there, first time it will show up an error, afterwards the page will load. Hit some refreshes and afterwards the like button on your site (on the entered url) will suddenly start working... Very weird! I think it has something to do with FB crawler and (maybe) when accessing the lint tool you somehow force the crawler to recheck your page or something.
If anyone finds out something else, please share, the issue is really annoying...
Looking at the forums here:
http://forum.developers.facebook.net/viewforum.php?id=53
It looks like several other developers are running into the same issue. Some posts there also brought up having to use the lint tool to get their like buttons to work. I've also gotten it to work on my site by just mashing the Like button until it eventually accepts it so like what hpuiu said, i'm pretty confident that this problem's on their end.
Edit: And maybe on a related note, another post said that FB stopped scraping their site until they used the lint tool on their page and another said that they seem to consistently get this issue for any new posts that're around for less than 24 hours.
You could try to add the Iframe version of the like box instead of their javascript version. Sometimes it actually works better when loading multiple post for example.
Facebook doesn't like the '/' at the end of the url. So you can use something like this to omit the '/' at the end of the url :
$title = get_permalink();
<fb:like href="<?php echo substr($title, 0, -1); ?>" layout="button_count" width="300" show_faces="false"></fb:like>
I have successfully setup an iFrame based App using the Javascript SDK, and we are trying to enable it on a Page Tab.
It seems Facebook has changed some things lately, because the app breaks when added to the Page Tab. I even went as far as making sure that all external scripts were included in the main index.php file, and that the body tags were taken out.
No, I'm trying to find out if it is even possible to use methods such as the stream.publish within a Profile Tab at all.
It seems like it isn't. As far as I can tell, you can no longer use any social methods on the Profile Tab.
Here were two related articles on the subject:
insidefacebook.com/2010/08/19/facebook-moving-toward-iframes-over-fbml-for-canvas-apps-and-page-tabs/
-and-
developers.facebook.com/roadmap
If anyone can confirm or deny this, it would be a huge help. The Facebook docs are just all over the place.
Here's a link to the working App Canvas as it stands now: http://apps.facebook.com/votetesting/
I know that on tab pages, you cannot do any JS until the user clicks on something first. Maybe that is the problem.
-Roozbeh