I am using this facebook page plugin to integrate it to my website. However, it seems that the maximum width is only 500px. There are many advices on the internet about other plugins but not about this.
Does anyone know a workaround how to make this page plugin expand to 100% of my web page?
Actually, you can't!
As plugin page source code resides inside iframe where CSS styles are applied locally.
Moreover plugin page iframe is out of your domain/server, so you cannot modify any resources because the SOP.
See:
In some point facebook says:
The plugin will by default adapt to the width of its parent container
on page load (min. 180px / max. 500px), useful for changing layout.
So no there's any workaround, even something ugly?
Yes, there is.
It's possible fetch the response page content (from iframe url) and replace the tag whith inline CSS from 500px to 100%, like this:
<?php
$url = 'IFRAME URL GOES HERE'; #copy and paste url from iframe plugin
$http_headers = array(
'User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:40.0) Gecko/20100101 Firefox/40.0',
'Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',
'Accept-Language: pt-BR,en-US;q=0.7,en;q=0.3',
);
$opener = curl_init($url);
curl_setopt_array($opener, array(
CURLOPT_SSL_VERIFYPEER => false,
CURLOPT_SSL_VERIFYHOST => false,
CURLOPT_HTTPHEADER => $http_headers,
CURLOPT_FOLLOWLOCATION => true,
CURLOPT_AUTOREFERER => true,
CURLOPT_RETURNTRANSFER => true,
));
$content = curl_exec($opener);
curl_close($opener);
# Maybe you want to use DomDocument + DOMXPath
echo str_replace('width: 500px', 'width: 100%', $content);
However, it isn't a proper solution. If some user click over button "like", for instance, the facebook popup can't open properly, then this may be a problem.
Related
Is there any way to post a picture? I found references on how to post it from own apps, but what about using the Graph api explorer tool? Btw, I'm not trying to upload a picture, I want to show a picture that's being stored on my server, directly in the post.
Edit1:
$graph_url = "https://graph.facebook.com/".$_POST['group_id']."/feed";
$postData = array(
'access_token' => $_POST['token'],
'message' => $_POST['message'],
'picture' => 'http://admin.oceaniatravel.ro/Files/Pictures/Images/iberostar-paraiso-maya-5-419.jpg');
$ch = curl_init();
curl_setopt_array($ch, array(
CURLOPT_URL => $graph_url,
CURLOPT_POSTFIELDS => $postData,
CURLOPT_RETURNTRANSFER => true,
CURLOPT_SSL_VERIFYPEER => false,
CURLOPT_VERBOSE => true
));
$result = json_decode(curl_exec($ch));
curl_close($ch);
Edit2
The problem was that I was using the graph explorer. A really easy solution is to create an own app and when you generate the token in the explorer app you just choose your own app. Thank you!
The problem with your error
(#100) The post's links must direct to the application's connect or canvas URL.
Was the fact, that you were using the access token generated through Graph Explorer. Which has its settings for Stream Post Url Security as enabled so that User may not use the Graph explorer for malicious purposes.
So, to solve the issue, create a new app, which as its default setting gets Stream Post Url Security as disabled, and then through Graph Explorer use the access token corresponding to your own app instead of Graph Explorer.
I'm suffering problems with my facebook application.
I want to post a swf player and it works, but when the user click in the image, the swf player doesn't appear in the wall, it opens in a new window.
How can I fix it?
$result = $facebook->api('/' . $user_id . '/feed' , 'post' , array(
"name" => "appname",
"message" => "test",
"picture" => "http://www.domain.com/image.png",
"link" => "http://www.domain.com",
"caption" => "test",
"description" => "test",
"source" => 'http://www.domain.com/playlist.swf?file='.$selected_value.''
));
Thank you very much
Attaching SWFs for inline play within the feed is certainly still possible. However, if you specify a http SWF, then we will only enable embedding for users that are browsing with secure mode disabled - otherwise mixed content warnings would be generated by the browser.
If you want your embed to work for all users, then you should host the SWF on a https server.
We used the link:
http://www.facebook.com/sharer.php?u=[shared URL]
...to share a particular page. However, Facebook Sharer uses the cached version of the images and the title. Is there a way to quickly clear the Facebook cache or how long do we have to wait until the data gets updated?
I placed <link rel='image_src' href='[preview image]' /> in between the tags.
I found a solution to my problem. You could go to this site:
https://developers.facebook.com/tools/debug
...then put in the URL of the page you want to share, and click "debug". It will automatically extract all the info on your meta tags and also clear the cache.
Use api Is there an API to force Facebook to scrape a page again?
$furl = 'https://graph.facebook.com';
$ch = curl_init();
curl_setopt( $ch, CURLOPT_URL, $furl );
curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );
curl_setopt( $ch, CURLOPT_POST, true );
$params = array(
'id' => '<update_url>',
'scrape' => true );
$data = http_build_query( $params );
curl_setopt( $ch, CURLOPT_POSTFIELDS, $data );
curl_exec( $ch );
$httpCode = curl_getinfo( $ch, CURLINFO_HTTP_CODE );
Facebook treats each url as unique and caches the page based on that url, so if you want to share the latest url the simplest solution is to add a query string with the url being shared. In simple words just add ?v=1 at the end of the url. Any number can be used in place of 1.
Hat tip: Umair Jabbar
I thing these two links have a wide discussion on your problem related stuff. fb:ref clear cashes by calling
fbml.refreshRefUrl
like this
<tt>fbml.refreshRefUrl("http://www.mysite.com/someurl.php")
You can study the related stuff from here fb:ref. I hope it will work for you
The page to do this is at https://developers.facebook.com/tools/debug/ and has changed slightly since some of the other answers.
Paste your URL in there and hit "Debug". Then hit the "Fetch new scrape information" button under the URL text field and you should be all set. It'll pull the fresh meta tags from your page, but they'll still cache so keep in mind you'll need to do this whenever you change them. This is really critical if you are playing with the meta tags to get FB Shared URLs to format the way you want them to inside of facebook.
This answer is intended for developers.
Clearing the cache means that new shares of this webpage will show the new content which is provided in the OG tags. But only if the URL that you are working on has less than 50 interactions (likes + shares). It will also not affect old links to this webpage which have already been posted on Facebook. Only when sharing the URL on Facebook again will the way that Facebook shows the link be updated.
catandmouse's answer is correct but you can also make Facebook clear the OG (OpenGraph) cache by sending a post request to graph.facebook.com (works for both http and https as of the writing of this answer). You do not need an access token.
A post request to graph.facebook.com may look as follows:
POST / HTTP/1.1
Content-Type: application/x-www-form-urlencoded
Host: graph.facebook.com
Content-Length: 63
Accept-Encoding: gzip
User-Agent: Mojolicious (Perl)
id=<url_encoded_url>&scrape=true
In Perl, you can use the following code where the library Mojo::UserAgent is used to send and receive HTTP requests:
sub _clear_og_cache_on_facebook {
my $fburl = "http://graph.facebook.com";
my $ua = Mojo::UserAgent->new;
my $clearurl = <the url you want Facebook to forget>;
my $post_body = {id => $clearurl, scrape => 'true'};
my $res = $ua->post($fburl => form => $post_body)->res;
my $code = $res->code;
unless ($code eq '200') {
Log->warn("Clearing cached OG data for $clearurl failed with code $code.");
}
}
}
Sending this post request through the terminal can be done with the following command:
curl -F id="<URL>" -F scrape=true graph.facebook.com
Append a ?v=random_string to the url.
If you are using this idea with Facebook share, make sure that the og:url param in the response
matches the url you are sharing. This will work with google plus too.
For Facebook, you can also force recrawl by making a post request to https://graph.facebook.com
{id: url,
scrape: true}
I just posted a simple solution that takes 5 seconds here on a related post here - Facebook debugger: Clear whole site cache
short answer... change your permalinks on a worpdress site in the permalinks settings to a custom one. I just added an underscore.
/_%postname%/
then facebook scrapes them all as new urls, new posts.
if you are using wordpress with a cache plugin, make sure you clear all your caches. Also make sure the image you are using has the recommended facebook size: 1200(w) x 630(h) or 600 x 315.
If you used managed wordpress or caching plugins, you have to CLEAR YOUR CACHE before the facebook debugger tool can fetch new info!
I've been pulling my hair out for weeks figuring out why changes I made wouldn't show up in facebook debugger for 24 hours!!!! The fix is I have to go into my wordpress dashboard, click the godaddy icon on the top, and click "flush cache." I think many managed wordpress hosters have a cache to figure out how to clear it and you'll be golden.
Facebook released the new Timeline for Pages today. Apps installed to pages as "tabs" now appear above the timeline with a 111px x 74px size thumbnail "app image". You can customize this on a per-page level (just like the custom tab name) if you navigate the Facebook Page admin interface.
You can update the tab's "custom name" via the Open Graph API, but they do not appear to have updated their API docs to show how to upload a custom tab_image (assuming they will). Is it possible now but undocumented? Has anyone figured out how to do this yet?
Updated 2016:
With the latest Open Graph 2.5 API tabs endpoint and PHP SDK 5, the code should look like this:
<?php
$fb = new Facebook\Facebook([/* . . . */]);
$response = $fb->post(
'/{page-id}/tabs',
[
'custom_name'=>'My Custom Tab',
'custom_image_url'=>'http://publicly.accessible/image.jpg',
'app_id'=>'{app-id}',
],
'{page-access-token}',
);
Original 2012 post:
I figured it out, it's just like uploading an image. The field is called "custom_image". Presumably they will update the documentation soon. It's nice they enabled this API hook so quickly with the new release!
Here's how to do it with the Facebook PHP SDK:
<?php
$page_access_token = 'XXXXXXX'; // you'll need the manage_pages permission to get this
$facebook = new Facebook(array(
'appId' => 'YOUR_APP_ID',
'secret' => 'YOUR_APP_SECRET',
'fileUpload' => true, // enables CURL # file uploads
));
$facebook->api(
'/PAGE_ID/tabs/TAB_NAME', // looks like "app_xxxx" where xxxx = APP_ID
'POST' // post to update
array(
'custom_image' => '#' . realpath('path/to/my/file.jpg'),
'custom_name' => 'My App', // give it a custom name if you want too
'access_token' => $page_access_token // access token for the page
)
);
Cheers
As you said Timeline for Pages is just announced and it's too soon to say it'll be possible via API. Currently it's not possible even in settings of your App in Developer Application.
This information is simply not yet documented in help center or Graph API documentation.
It's also way soon to say someone have discovered if such functionality exists...
We all should wait a bit and probably file bugs which may get some response from officials confirming, rejecting or adding this to wish list.
We used the link:
http://www.facebook.com/sharer.php?u=[shared URL]
...to share a particular page. However, Facebook Sharer uses the cached version of the images and the title. Is there a way to quickly clear the Facebook cache or how long do we have to wait until the data gets updated?
I placed <link rel='image_src' href='[preview image]' /> in between the tags.
I found a solution to my problem. You could go to this site:
https://developers.facebook.com/tools/debug
...then put in the URL of the page you want to share, and click "debug". It will automatically extract all the info on your meta tags and also clear the cache.
Use api Is there an API to force Facebook to scrape a page again?
$furl = 'https://graph.facebook.com';
$ch = curl_init();
curl_setopt( $ch, CURLOPT_URL, $furl );
curl_setopt( $ch, CURLOPT_RETURNTRANSFER, true );
curl_setopt( $ch, CURLOPT_POST, true );
$params = array(
'id' => '<update_url>',
'scrape' => true );
$data = http_build_query( $params );
curl_setopt( $ch, CURLOPT_POSTFIELDS, $data );
curl_exec( $ch );
$httpCode = curl_getinfo( $ch, CURLINFO_HTTP_CODE );
Facebook treats each url as unique and caches the page based on that url, so if you want to share the latest url the simplest solution is to add a query string with the url being shared. In simple words just add ?v=1 at the end of the url. Any number can be used in place of 1.
Hat tip: Umair Jabbar
I thing these two links have a wide discussion on your problem related stuff. fb:ref clear cashes by calling
fbml.refreshRefUrl
like this
<tt>fbml.refreshRefUrl("http://www.mysite.com/someurl.php")
You can study the related stuff from here fb:ref. I hope it will work for you
The page to do this is at https://developers.facebook.com/tools/debug/ and has changed slightly since some of the other answers.
Paste your URL in there and hit "Debug". Then hit the "Fetch new scrape information" button under the URL text field and you should be all set. It'll pull the fresh meta tags from your page, but they'll still cache so keep in mind you'll need to do this whenever you change them. This is really critical if you are playing with the meta tags to get FB Shared URLs to format the way you want them to inside of facebook.
This answer is intended for developers.
Clearing the cache means that new shares of this webpage will show the new content which is provided in the OG tags. But only if the URL that you are working on has less than 50 interactions (likes + shares). It will also not affect old links to this webpage which have already been posted on Facebook. Only when sharing the URL on Facebook again will the way that Facebook shows the link be updated.
catandmouse's answer is correct but you can also make Facebook clear the OG (OpenGraph) cache by sending a post request to graph.facebook.com (works for both http and https as of the writing of this answer). You do not need an access token.
A post request to graph.facebook.com may look as follows:
POST / HTTP/1.1
Content-Type: application/x-www-form-urlencoded
Host: graph.facebook.com
Content-Length: 63
Accept-Encoding: gzip
User-Agent: Mojolicious (Perl)
id=<url_encoded_url>&scrape=true
In Perl, you can use the following code where the library Mojo::UserAgent is used to send and receive HTTP requests:
sub _clear_og_cache_on_facebook {
my $fburl = "http://graph.facebook.com";
my $ua = Mojo::UserAgent->new;
my $clearurl = <the url you want Facebook to forget>;
my $post_body = {id => $clearurl, scrape => 'true'};
my $res = $ua->post($fburl => form => $post_body)->res;
my $code = $res->code;
unless ($code eq '200') {
Log->warn("Clearing cached OG data for $clearurl failed with code $code.");
}
}
}
Sending this post request through the terminal can be done with the following command:
curl -F id="<URL>" -F scrape=true graph.facebook.com
Append a ?v=random_string to the url.
If you are using this idea with Facebook share, make sure that the og:url param in the response
matches the url you are sharing. This will work with google plus too.
For Facebook, you can also force recrawl by making a post request to https://graph.facebook.com
{id: url,
scrape: true}
I just posted a simple solution that takes 5 seconds here on a related post here - Facebook debugger: Clear whole site cache
short answer... change your permalinks on a worpdress site in the permalinks settings to a custom one. I just added an underscore.
/_%postname%/
then facebook scrapes them all as new urls, new posts.
if you are using wordpress with a cache plugin, make sure you clear all your caches. Also make sure the image you are using has the recommended facebook size: 1200(w) x 630(h) or 600 x 315.
If you used managed wordpress or caching plugins, you have to CLEAR YOUR CACHE before the facebook debugger tool can fetch new info!
I've been pulling my hair out for weeks figuring out why changes I made wouldn't show up in facebook debugger for 24 hours!!!! The fix is I have to go into my wordpress dashboard, click the godaddy icon on the top, and click "flush cache." I think many managed wordpress hosters have a cache to figure out how to clear it and you'll be golden.