use Facebook OpenGraph with a custom Facebook button? - facebook

I want to add Facebook OpenGraph tags to my page, but I also want to stick with the style of Facebook Like button that I currently have (a custom image tag).
The OpenGraph plugin instructions suggest you have to use Facebook's own Like button styles, and the customization options are limited.
Is there any way I can apply the Facebook Like code to my own image button?
UPDATE: to be clear, what I mean is that I have an image on my page that links to https://www.facebook.com/sharer/sharer.php?.... I don't have a standard Facebook Like button. Will this mean that the OpenGraph tags on my page don't actually do anything?

The old sharer.php endpoint will read the same meta tags as the Like button - when shared, the Facebook crawler accesses your site and pulls the metadata for the post (image, description, etc)
If you want to generate some sample metadata there's a form on the like button documentation (see 'step 2') to output tags in the correct format.
Use the Debug tool to see what tags Facebook detects on your site.

It's against facebook's policies to try and replicate or re-create the like button.
Adding open graph tags won't affect your page, but they will improve how it appears when shared or liked in Facebook.
You may create a button called share which opens the feed dialog (sharer.php is deprecated) but you must use the real like button, not a custom image tag.

Related

facebook: own share button with different data

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

FaceBook feed dialog share options

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.

Facebook like a different domain

OK, I have the standard Facebook Like code.
But we are ajaxing in Tumblr posts from the Tumblr feed and putting the FB Like button in.
So we are LIKING the Tumblr post URL.
However the page is not on a Tumbler URL, so FB momentarilly shows the comments box, then replaces it with a Confirm button, which triggers a popup. Like in the popup, then it allows you to use the normal JS comment that should appear on the button.
QA and UI have flagged this up as unacceptable, so is this a massive UI failing by FB? Whatever it is, and how can I get around it?
If we LIKE a unique URL on our site/domain this works as intended;
BUT THEN we would have to write a backend to receive that URL and present OG tags for FB to scrape, probably grabbing from the tumblr post.
Yes, by default the Like plugin it will search the page for og:metadata,
to go forward you can use the new build in, Open Graph Like Action
http://developers.facebook.com/docs/opengraph/actions/builtin/likes/
So, now you can associate each Open Graph object with a like.

Facebook Like button: how it choose image to display

I've put "Like" button to my web site.
In general it works fine, the only problem is when user add some text and publish it in the profile his post contains image. And the image chosen is not something meaningful, it is one of the menu items that doesn't really makes any sense.
Could you please advise how to tip to the facebook the better image? I didn't see any information about that in their documentation (http://developers.facebook.com/docs/reference/plugins/like/), probably I've overlooked that?
Thank you.
P.S. Pretty similar question: is there any way to suggest for user text he wants to share (that will appear once user click "Like" button)?
You can specify image by adding Open Graph tags to head section each page containing the "Like" button.
You can specify an image URL in og:image tag, and Facebook will use this image in the user's profile entry.
The same goes with
og:title - this will be the title of the new entry on user's profile.
og:site_name (will be displayed as grey text under title) etc.
See http://developers.facebook.com/docs/reference/plugins/like/ and
http://developers.facebook.com/docs/opengraphprotocol/
for detailed description.
You can use the Open Graph tags for both versions of the "like" button - iframe and XFBML.
Once you add the tags to your pages you can use http://developers.facebook.com/tools/debug to check if they are OK.

need to choose from an array of images to share or like to facebook using graph API

I want to share to facebook a link and allow the user to choose from an array of thumbnails. This ability of choosing the thumbnail was capable with the share button but facebook has deprecated that functionality and the share button in favor of like which to my knowledge does not allow for selection of thumbnail it only uses one.
Can someone tell me how to pass a particular array of images to the share button object
OR
how to enable this functionality using the facebook graph API?
If you share the url link, that url link can have many og:image tags in it. See: https://developers.facebook.com/docs/reference/plugins/like/ for further information on how to setup the og meta tags in your url.