Fb Pages embedding plugin not load - facebook

I'm trying to use the plugin
https://developers.facebook.com/docs/plugins/page-plugin/
to load the timeline of a page on a php site
I also created at https://developers.facebook.com
an app ... and I put it live
but nothing has changed.
it's strange because on some computers it works, on others it doesn't
how it doesn't work on mobile.
I don't understand why.
the error message makes me think that the problem is browsers blocking the plugin and I tried to follow this, to catch the problem.
Facebook Sdk blocked : How to detect if a user is using Ghostery?
the code taken from fb is the following:
<div id="fb-root"></div>
<script async defer crossorigin="anonymous"
src="https://connect.facebook.net/it_IT/sdk.js#xfbml=1&version=v15.0&appId=536891684570335&autoLogAppEvents=1" nonce="Y1MwGcHs"></script>
<div class="fb-page" data-href="https://www.facebook.com/autodriveskicup/" data-tabs="timeline" data-width="500" data-height="725" data-small-header="true" data-adapt-container-width="true" data-hide-cover="true" data-show-facepile="true">
<blockquote cite="https://www.facebook.com/autodriveskicup/" class="fb-xfbml-parse-ignore">
Autodrive Ski Cup
</blockquote>
</div>
the result can be seen here:
www.autodrive.org
Can anyone help me?
I just want the plugin to load the timeline
or alternatively be able to read the error and hide the fb div and show an alternative image when the plugin doesn't work

Related

facebook page plugin not working properly

I need a embedded facebook page plugin.
But the code generator of facebook doesn't work. When i give the url of the facebook page, the generator doens't give the code for this page.
Also doesn't appear the page in the preview modus.
The facebook page is: https://www.facebook.com/Tapas.Enschede/
The code generator is on this page.
https://developers.facebook.com/docs/plugins/page-plugin/
For other facebookpages the code generator works perfect. I have no idea what the problem is.
I really appreciate any help.
I had the same issue today.
Check to see if:
Your page is unpublished.
You have Age Restriction (which was my issue) activated. Any age restriction above 13+ will cause the page plugin to not work.
You have Country Restrictions activated.
Any of the above will cause the page plugin not to display.
You can find these settings in the General tab in your page settings.
In my case,I remove the heading (h4) from the class="fb-page".Working now.
Old Code
<div class="fb-page" data-href="https://www.facebook.com/PageTest/"
data-tabs="timeline" data-small-header="false"
data-adapt-container-width="true"
data-hide-cover="false" data-show-facepile="true">
<h4 class="center">Follow Us On Facebook</h4>
<blockquote cite="https://www.facebook.com/PageTest/" class="fb-xfbml-parse-ignore">Testing.</blockquote>
</div>
New Code
<div class="fb-page" data-href="https://www.facebook.com/PageTest/"
data-tabs="timeline" data-small-header="false"
data-adapt-container-width="true"
data-hide-cover="false" data-show-facepile="true">
<blockquote cite="https://www.facebook.com/PageTest/" class="fb-xfbml-parse-ignore">Testing.</blockquote>
</div>
I found it was due to some stale Facebook Cookies on my browser. Deleted the Facebook Cookies, refreshed and all worked great then
use data-show-posts="true" instead of data-tabs="timeline"

Inserting Facebook plugin on mediawiki

I am trying to get the Facebook plugin working on my wiki. Using the guidelines provided by Facebook I copied the Java Script SDK in MediaWiki:Common.js, which should run it for all users.
Now I am trying to enter the simple HTML code also generated by Facebook :
<div id="Facebook" class="fb-page" data-href="(my FB page)" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"></div>
'My FB page' is of course replaced by the actual URL.
I tried two ways of entering the code.
Making a Template:Facebook page and linking to it like {{Facebook}} on the actual page
Even though this is not recommended forcing the html by adding the parameter $wgRawHtml = true; and entering the code in the ... tags.
None of this ways resulted in the Facebook plugin appearing on my wiki.

Integrating facebook Channelurl into Javascript which enables xhtml validation

I use a script I got from the thread below, and adapted slightly
New Facebook like button HTML validation
however the channelurl doesn't work(lots of fd_fragment and multiple visits 10s apart) and I am not 100% convinced about the provenance or the effectiveness of the code, though it does leave me with valid xhtml,
I have tested the like function and it works for me, but I keep seeing "like" operations in my analytics that don't translate into visible "likes" from visitors
furthermore, I find no ref to "fbcont" in facebook literature
Sadly, javascript/ajax is not yet comfortable for me so i'm fumbling a bit here
Can anyone enlighten me about whats wrong with the code
Thanks
My Code:
<div id="FbCont">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1" type="text/javascript">
</script>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var fb = document.createElement('fb:like');
fb.setAttribute("href","http://www.mydomainname.com");
fb.setAttribute("send","true");
fb.setAttribute("action","like");
fb.setAttribute("layout","button_count");
fb.setAttribute("show_faces","true");
fb.setAttribute("width","100");
fb.setAttribute("font","");
fb.setAttribute("channelUrl","http://www.mydomainname.com/channel.html");
document.getElementById("FbCont").appendChild(fb);
//--><!]]>
</script>
</div>

Server-side response will not show in PhoneGap + jQuery Mobile app

I have a fairly simple jQuery mobile app, which works fine as a web app (tested in browsers on desktops/smartphones) but when porting it to android using phonegap, I have one major issue. It occurs both on a real phone and in an AVD.
there's a form in the app, like:
<div data-theme="a" data-role="dialog" id="a-form">
<div data-role="content">
<h3>...</h3>
<form action="http://a-live-site.com/a-form.php" method="post">
...
<div data-role="fieldcontain">
<button type="submit">Submit</button>
</div>
</form>
</div>
</div>
Its response content loads perfectly in the browser (the action is a relative link there), but within phonegap I just get a white screen and the hardware back button exits the app instead of the usual step back in history. The puzzling thing is that the request actually gets through. The server side code triggers an email, so I know the server is getting the request. I have added the appropriate <access /> rules in the phonegap.xml file, but I'm not sure that's enough.
EDIT: the form is in static content so, in phonegap, it's loaded by file:// and shouldn't have cross-domain issues.
The problem was due to data-role="dialog" in the result. Using page fixed it. It only broke in phonegap and phonegap's logs made it look like it was something else. A real PITA.

Facebook IFrame on page canvas?

Hey guys, I have developed a small site that i would like to embed into a tab on a facebook page.
Previously I used this code to load in an iframe, it worked great:
<a onClick="outside_location.setInnerFBML(link_1);" style="cursor: pointer;">Link 1</a> | <a class="red" onClick="outside_location.setInnerFBML(link_2);" style="cursor: pointer;">Link 2</a>
<div id="outside_location"></div>
<fb:js-string var="link_1"><fb:iframe width="760" height="1280" frameborder='0' src='http://www.WebWhispers.in' /></fb:js-string>
<fb:js-string var="link_2"><fb:iframe width="760" height="1280" frameborder='0' src='http://google.com/' /></fb:js-string>
<script type="text/javascript" charset="utf-8">
var outside_location = d
document.getElementById('outside_location');
</script>
However, it has stopped working. I dont think facebook allows iframe inside of pages, only applications.
How can I load this page in without learning FBML? The site uses Jquery so I cant use FBML anyway.
I know applications can use iFrames, can I make it an application and then embed the application into a page tab somehow?
No. Tab pages can not contain iFrames. They must be written using FBML and FBJS.
One reason for this is that Facebook does not want to enable Tab pages to detect who looks at them. All requests (including images) on tab pages are proxied through Facebook for this reason. If iframes were allowed then the application would be able to detect who looked at it, which would present a privacy issue for Facebook users.
This is either a policy change by Facebook or, more likely, a bug. I say it's unlikely to be a policy change as it throws a script error, whereas a policy change would more likely strip the code out before it's rendered.
There's a bug report you can add votes to and follow here.