Im trying to share some content with the share dialog of facebook.
My target is to share a product that a costumer bought. I like to share a custom text, an image of the product and the product link.
It should look like that:
I know that Facebook scrapes the URL I pass and gets it information based on the page, but I really wish that I can pass the text at least to the share dialog.
So the question is how to customize the informations that are being shared.
I tried different solutions, like using the sharer.php link and with the FB SDK with share_button that uses FB.ui.
Sharer.php
<div class="fb-share-button"
data-href="http://www.facebook.com/sharer.php?s=100
&p[url]=http://bit.ly/myelection&p[images][0]=http://election.gv.my/assets/vote.png
&p[title]=My customized title
&p[summary]=My customized summary"a-width="100">
</div>
Share-Button with JDK
<div class="fb-share-button" data-href="http://www.gartenxxl.de/p-1473049000">
</div>
I did not try to use the Javascript SDK and the FB.Ui method to create a share-dialog, because I did not want to register as Facebook-Developer yet and create an App for the FB-Api-Key, but maybe thats the only way.
Then I would try that like this:
JS
$('#'#'#share_button').click(
function(e){e.preventDefault();
FB.ui(
{
method: 'feed',
name: 'This is the content of the "name" field.',
link: 'http://www.groupstudy.in/articlePost.php?id=A_111213073144',
picture: 'http://www.groupstudy.in/img/logo3.jpeg',
caption: 'Top 3 reasons why you should care about your finance',
description: 'This is a Description',
message: ''
});
});
});
Unfortunately, dynamic content is not really possible anymore:
The feed dialog is deprecated and should not be used anymore.
Facebook will probably remove it sooner or later so i would not count
on it.
Even if it would be possible to add a custom message with a parameter, it would not be allowed. According to the platform policy, the message must be 100% user generated, prefilling is not allowed.
All the existing (and NOT deprecated) possibilities only take the URL as parameter and they read the title/description/image from the Open Graph tags of that URL.
The best you can do for bought products is to use the sharer.php, the Share Social Plugin or the FB.ui share dialog. If you want a custom share button design, you would need to go with sharer.php or FB.ui share, of course.
Btw, this link may be helpful for the Open Graph tags: http://ogp.me/
Related
I want to make a custom Facebook share button on a website. I use this link:
http://www.facebook.com/sharer.php?s=100&p[title]=title&p[url]=http://myurl.com&p[summary]=summary&p[images][0]=myimage
I have set the og Meta-Tags for sharing the main-site. But the Problem is that if I use the share Link above Facebook shows images/title/summary/etc from the Meta-Tags and not from the Link Parameters.
How can I force Facebook to use the data from the Parameters without changing/removing the Meta-Tags
The sharer will no longer accept custom parameters and facebook will pull the information that is being displayed in the preview the same way that it would appear on facebook as a post, from the url OG meta tags.
Source: https://developers.facebook.com/x/bugs/357750474364812/
You can use the feed dialog instead, but you would need to create an App for that: https://developers.facebook.com/docs/sharing/reference/feed-dialog
The original method for sharing links with a custom image, text and link appears to have been stripped from Facebook. I for one would love to see them bring this back.
Here is my situtation. I have a Facebook tab that loads a page that is hosted under my hosteddomains.com. I setup a Facebook app to work with my Facebook tab. When I try to use the new "Share Dialog" if the link I want to share is not the same as the app domains then i get an error and I can't share the link. Am I doing something wrong or is this what they intended to do?
IF that's what they intended to do then there is no way that this will replace what sharer.php could do. I could be on any site and share any link with an image to Facebook and have it posted to my wall.
The question is if i am on facebook tab and i want to share a link (I want a dialog box with a custom photo, title, link, and summary) and allow my users to post this custom message to there Facebook status.
Maybe i am confused about how to accomplish this, but so far i am not having much luck.
I miss the good ole days when i could just construct a URL and that would give me the ability to share what i want to share. Twitter and Pinterest have these methods.
Here are some code examples of things that I've tried that did not work:
Option #1:
The url in this option goes to page that I created on hosteddomains.com that has the Open Graph Meta Tags in it. My idea was to share these pages from my server that will direct them back to my Facebook tab. The result I was getting from this method was seeing the title of the tab from my FB page and description. The reason turned out to be that if i set the og:url to my Facebook tab page, that's the page that would get scraped. That's not what i was expecting from this method. I thought it would take the meta tags from the page i shared and the url with it. Not take all of the info from url and ignore the meta tags.
<a href="https://www.facebook.com/sharer/sharer.php?u=[URL]"
target="_parent">SHARE ON FB</a></p>
Option #2:
Tried using Facebook Share Dialog. I had an interesting time with this one. I setup a new Facebook app. I tried the Facebook tab as the URL and also my custom url to the page that has custom open graph meta tags. The facebook app has two App Domains - hosteddomain.com and websiteA.com. I also created a Page Tab section. The page tab section loads the HTML page that was loaded in the tab we made for our facebook page. Issue with this method is I don't get a custom open graph options set from my php page. I'm picking up information from the facebook tab again. At least now the dialog box shows the name of the new app. I am limited in what i can share using this method. The url i share has to belong to the App Domains. In order to have multiple app domains, I had to make that Page Tab section and then add the second url to the App Domains field, otherwise i got a warning.
<a href="https://www.facebook.com/dialog/share?app_id=[appID]&display=popup&href=[url]
&redirect_uri=[url]&ref=s" target="_blank">SHARE THIS</a>
Option #3
The last thing I tried was the fb-share-button using the Javascript SDK. I get the same result as option #1. I don't think there is much difference between these two. Option 3 here is a bit easier to deal with and cleaner code. In this example, the url is to my custom page on hosteddomains.com that has my custom open graph meta tags. That doesnt seem to matter though. It still pulls the info from the og:url meta tag. I tried removing the og:url meta tag. I get the same result. Is it the Page Tab info interfering?
<div class="fb-share-button" data-href="[url]"></div>
Some Background Info
As of Mar/Feb 2014, the Facebook sharer.php way of sharing content no longer accepts custom parameters. See response from a Facebook engineer.
It used to allow multiple parameters in this form:
http://www.facebook.com/sharer.php?s=100
&p[url]={url}
&p[images][0]={img}
&p[title]={title}
&p[summary]={desc}
So you could override the title, image and description that facebook would scrape from the page, but it seems these are now ignored.
Instead, Facebook now favours the opengraph tags on the page.
So why is this a problem?
This is my scenario: I have a gallery page with multitple images. I have a lightbox that loads an image when clicked, and when the lightbox is shown, I also show share icons for all the major social networks, including facebook.
The facebook sharer url is built up using the above format, so I pass in the specific image together with the image caption. These values are now ignored.
Feed Dialog To The Rescue?
The Feed dialog method of sharing is now the preferred method, and it supports passing in custom images and captions. It works perfectly in my above gallery scenario. But it has a limitation: it does not allow you to share the content on a page you manage like the sharer.php does:
So my question is...
How can I get the Feed Dialog to work like the sharer.php and give the end-user the option to share to a group, friend's timeline or a page he/she manages?
But it has a limitation: it does not allow you to share the content on a page you manage like the sharer.php does
It incorrect statement. You can post anywhere using the Feed Dialog! You can use the to parameter and give it the concerned id where you want to share the feed.
For example
PS Facebook has introduces Graph API v2 today, and introduced new Share Dialogs over Feed Dialogs. I'm not share if that's to your significance but you can have a look.
I added the facebook share button within an email body (.htm). The purpose of the button is to share the photo a user received in his email. When the button is clicked, a new tab opens with the "Write a message" area to share on facebook.
The problem is that once "Share Link" button is clicked nothing happens - no confirmation, no redirect, BUT the link is actually posted on Facebook (so the end user would not know the message has been shared unless they check their Facebook while all confused). Here is the code for the button:
<a title="Share this photo"
href="http://www.facebook.com/sharer.php?
s=100
&p[url]=%PHOTO_LINK%.jpg (dynamically populated link)
&p[title]=Check out my pic!"
target="_blank">
<img src="someplace.png"
alt="Share on Facebook" height="50" width="50" />
</a>
I have tried using meta tags (title/description/url and the main namespace tag), but they are not picked up when shared (title/description is a bunch of random characters). Is this behaviour normal for share buttons of this sort, is it a bug or am I doing something wrong?
Thanks in advance
To fix this, put target="_blank" in the <a> tag.
You won't be able to share a photo within an email as it would mean sharing the URL to the email itself (which users won't have access to).
Instead, you should put the image on a website and use OpenGraph markup to give it a correct title, description, and thumbnail image. And then share the URL to this image on Facebook. You can still embed the image in the email, but the sharing and image need to be external from the email.
A lot has happened since 2012. There are now two API's a user may choose from when sharing on Facebook: 1) Sharer, and 2) Share Dialog.
Sharer: This will require confirmation of the user posting their content, and this will then get you what you want. However, Sharer only supports the url parameter now. There is basically no way to share any other parameter. Official Facebook Developer Docs: Share Button. And: Official Facebook Discontinuation of Sharer Non-URL Args Post.
Share Dialog: You will need to configure an App with Facebook, authenticate, and then to solve your problem, you'll want to set one of these params...
display : Set this to page (the default), or one of the other options, to determine how your share dialog displays.
redirect_uri : If you don't like how Facebook decides to interpret your display params, you can just redirect after sharing to some page on your site that says, "Post successfully shared! link to post" or some such.
Hope this helps someone.
I have added a facebook share link to my sharepoint site using:
<a name="fb_share"></a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"
type="text/javascript">
</script>
I have added the script to the masterpage and the link to the page layout. I all works fine apart from that when a new page is created using the masterpage with the script some of the editong tools are disabled. For example the Format and Markup Style Menus are disabled. Can this be problem be solved?
You might want to take a look at this link :
https://developers.facebook.com/docs/plugins/
It contains all the official Facebook plugins that you can embed into your site. In your case you should look in specific at the Send Button.
The Send Button allows users to easily send content to their friends.
People will have the option to send your URL in a message to their
Facebook friends, to the group wall of one of their Facebook groups,
and as an email to any email address. While the Like Button allows
users to share content with all of their friends, the Send Button
allows them to send a private message to just a few friends.
The message will include a link to the URL specified in the send
button, along with a title, image, and short description of the link.
You can specify what is shown for the title, image, and description by
using Open Graph meta tags.
It is very easy to implement these plugins - usually a case of "copy-and-paste". It looks to me that you have been using an outdated method of the Facebook share feature.