Want custom title / image / description in facebook share link from a flash app [duplicate]

Question

Possible Duplicate:
How does Facebook Sharer select Images?

I am making a flash app that demonstrates potensial traffic injuries when driving at different speeds. I want the user to be able to share this information on facebook. However this demands that i can customize the text that will appear on facebook in some manner.

I am making an url that is opened in a blank window (from the flash app itself). I specify the u and t parameters, putting the generated message as the t parameter. But this seems to always be overridden by the pages title. If i omit the title tag from the html code, the file name is used (also overriding the specified title).

http://www.facebook.com/sharer.php?u=http://espentokerud.com/face/addiste.html&t=test;

I also tried url-encoding the url, but to no avail.

http://www.facebook.com/sharer.php?u=http%3a%2f%2fespentokerud.com%2fface%2faddiste.html&t=test;

I also tried using the addthis API, but experience the same shortcomings. The funny thing is that if i post a swf, the title and description can be customized, and it is also possible to specify a screenshot. But if i dont post a swf, this seems to be ignored.

I am aware that I can use meta tags on the html page to specify the thumbnail image, title and description, but some of this content has to be based on calculations inside the flash app.

Rigging

I also get this problem and would be very interested in a solution, as it seems counter-intuative that it would reset them after you specifically gave it parameters! – Tahmosh

I'm stuck with the same issue gonna place a bounty – Xenophon

@stealthcopter, @Rodrigo you just can't, you need have the metadata at the target page. That said, you can work around it, check my answer. – Director

Did you get your question answered? – Malay

Pretty sure you no longer can use &t to set the title. – Romanfleuve

Answer 1

2016 Update

Use the Sharing Debugger to figure out what your problems are.

Make sure you're following the Facebook Sharing Best Practices.

Make sure you're using the Open Graph Markup correctly.

Original Answer

I agree with what has already been said here, but per documentation on the Facebook developer site, you might want to use the following meta tags.

<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />

If you are not able to accomplish your goal with meta tags and you need a URL embedded version, see @Lelis718's answer below.

Malay

Awesome, thanks for pointing out the change. Once I can confirm this actually works I'll update my code :) – Grounds

what if we have a dynamic title and description?? – Beverlybevers

I haven't tried it, but I would imagine you could just replace the static title and description with your dynamic values. – Malay

I have these set, but it seems like sharer.php isn't getting them. Is it working for anybody else? Maybe it has do with them pushing "like" over "share" buttons. – Coreycorf

@Coreycorf - Try this #2950689 – Malay

@forresto, did that other SO answer work for sharer? – Malay

This works for me, the issue is that facebook caches the content after the first like (not sure how long for) so try a different url to see if your changes have worked. – Ellen

@Malay what about we have handle multiple multiple share buttons on the same page. I am unable to do – Discordant

@AnkitPandey I think this answer really only applies to someone sharing a URL directly in Facebook. If you're doing sharing with buttons, I would think you would have to provide some info on the button action or by building a URL or something with query params. Unfortunately I don't know the answer to your question. – Malay

Answer 2

I think this site has the solution, i will test it now. It Seems like facebook has changed the parameters of share.php so, in order to customize share window text and images you have to put parameters in a "p" array.

http://www.daddydesign.com/wordpress/how-to-create-a-custom-facebook-share-button-for-your-iframe-tab/

Check it out.

Increase

This is exactly what I was looking for. The graph API is good for a lot of things, but just pre-propogating some post data shouldn't need tokens and app authorizations. – Silence

does not work for me now – Disastrous

That is what I was looking for, the URL structure to provide a link to a third party image along with the page it's viewed on as the URL. Here it is if anyone else is looking facebook.com/sharer/… – Nealy

This doesn't work anymore. Can you please suggest any alternate solution? – Fagin

Answer 3

I had this same problem a week ago.

First of all I noticed your URL has an ampersand preceding the parameter string, but it probably needs to have a question mark instead to begin the parameter string, followed by an ampersand between each additional parameter.

Now, you do need to escape your URL but also double-escape the URL parameters (title or other content you need to provide content in the Share) you are passing to the URL, as follows:

var myParams = 't=' + escape('Some title here.') + '&id=' + escape('some content ID or any other value I want to load');
var fooBar = 'http://www.facebook.com/share.php?u=' + escape('http://foobar.com/superDuperSharingPage.php?' + myParams);

Now, you need to create the above-linked superDuperSharingPage.php, which should provide the dynamic title, description, and image content you desire. Something like this should suffice:

<?php
    // get our URL query parameters
    $title = $_GET['t'];
    $id = $_GET['id'];
    // maybe we want to load some content with the id I'll pretend we loaded a
    // description from some database in the sky which is magically arranged thusly:
    $desciption = $databaseInTheSky[$id]['description'];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title><?php echo $title;?></title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta name="title" content="<?php echo $title;?>" />
  <meta name="description" content="<?php echo $desciption;?>" />
  <!-- the following line redirects to wherever we want the USER to land -->
  <!-- Facebook won't follow it. you may or may not actually want || need this. -->
  <meta http-equiv="refresh" content="1;URL=http://foobar.com" />
</head>
<body>
  <p><?php echo $desciption;?></p>
  <p><img src="image_a_<?php echo $id;?>.jpg" alt="Alt tags are always a good idea." /></p>
  <p><img src="image_b_<?php echo $id;?>.jpg" alt="Make the web more accessible to the blind!" /></p>
</body>
</html>

Let me know if this works for you, it's essentially what did for me :)

Grounds

Great, thanks. This idea of double-escaping saved me a lot of time. – Urceolate

Answer 4

I actually have a similar problem. I have a page with multiple radio buttons; each button will set the title and description meta tags of the page, via JavaScript upon change.

For example, if users select the first button, the meta tags will say:

<meta name="title" content="First Title">
<meta name="description" content="First Description">

If the user select the second button, this changes the meta tags to:

<meta name="title" content="Second Title">
<meta name="description" content="Second Description">

... and so on. I have confirmed that the code is working fine via Firebug (i.e. I can see that those two tags were properly changed).

Apparently, Facebook Share only pulls in the title and description meta tags that are available upon page load. The changes to those two tags post page load are completely ignored.

Does anybody have any ideas on how to solve this? That is, to force Facebook to get the latest values that are change after the page loads.

Thirteen

the url you send to facebook must include the option selected to get back to your site. Use that to make sure the values are loaded at page load. See my answer for more clear information on how to work around the problem. – Director

Answer 5

I have a Joomla Module that displays stuff... and I want to be able to share that stuff on facebook and not the Page's Title Meta Description... so my workaround is to have a secret .php file on the server that gets executed when it detects the FB's

$_SERVER['HTTP_USER_AGENT']

if($_SERVER['HTTP_USER_AGENT'] != 'facebookexternalhit/1.1 (+http://www.facebook.com/externalhit_uatext.php)') {
    echo 'Direct Access';
} else {
    echo 'FB Accessed';
}

and pass variables with the URL that formats that particular page with the title and meta desciption of the item I want to share from my joomla module...

a name="fb_share" share_url="MYURL/sharer.php?title=TITLE&desc=DESC"

hope this helps...

Probably

Answer 6

You can't, it just doesn't support it.

I have to ask, why those calculations need to happen Only inside the flash app?

You have to be navigating to an URL that clearly relates to the metadata you get from the flash app. Otherwise how would the flash app know to get the values depending on the URL you hit.

Options are:

• calculate on the page: When serving the page you need to do those same calculations on the server and send the title, etc on the page metadata.
• send metadata in the query string to your site: If you really must keep the calculation off the server, an alternative trick would be to explicitly set the metadata in the URL the users click to get to your site from Facebook. When processing the page, you just copy it back in the metadata sections (don't forget to encode appropriately). That is clearly limited because of the url size restrictions.
• send the calculation results in the query string to your site: if those calculations just give you a couple numbers that are used in the metadata, you could include just that in the query string of the URL the users click back to your site. That's more likely to not give you problems with URL sizes.

---

re

Why is this upvoted? It's wrong. You CAN - it IS supported to add custom title, description and images to your share. I do it all the time. – Dustin Fineout 3 hours ago

The OP very clearly stated that he already knew you could serve that from a page, but wanted to pass the values directly to facebook (not through the target page).

Besides, note that I gave 3 different options to work around the issue, one of which is what you posted as an answer later. Your option isn't how the OP was trying to do it, its just a workaround because of facebook restrictions.

Finally, just as I did, you should mention that particular solution is flawed because you can easily hit the URL size restriction.

Director

Why is this upvoted? It's wrong. You CAN - it IS supported to add custom title, description and images to your share. I do it all the time. – Grounds

@Dustin read before down voting ;). see my reply in the update to my answer – Director

I did fully read, they are all good suggestions as I said in my former comment! In fact they are to some extent each exhibited in my own answer. I disagree with your answer that "you can't, it just doesn't support it" which is incorrect and happens to be the very first line of your answer. – Grounds

I'm sorry, but again you are dismissing part of the text "The OP very clearly stated that he already knew you could serve that from a page, but wanted to pass the values directly to facebook (not through the target page)." ... so yes, you can't do what the OP wanted, our solutions are workarounds / not really sending it to facebook Directly. – Director