Multiple Facebook share button/link on the same page refering different TITLE & LINK - facebook

I need to create a "contest" page where user will be asked to submit picture.
After that, they should be able to share their picture on FB, Twitter, G+, Pinterest, etc for other people to come and vote.
I want the page to be displayed as a jQuery gallery and whenever people select a thumbnail, the bigger picture open with the associated vote and "share" button.
When a user share an image, I want a specific TITLE & URL associated with that particular image... something like "http://www.mysite.com/contest.html#picture1"... or "http://www.mysite.com/contest.html#picture2"
How is this possible if I only have one page?
I wouldn't have problem if I could use the old "facebook.com/sharer.php" with parameters... but it seems that the Open Graph Protocol is "overiding" the sharer.php parameters....
Works fine with Twitter and Pinterest... I might have the same problem with Google+.
Excuse my bad english, thanks!

Well, set up a (“dummy”) page for each picture, and fill it with the appropriate OG tags … and have your users like that. And then put a JS redirect into that page, so that users following the link when it’s shared on Facebook will get to the “real” address you want them to end up at.
(Btw., IMHO this is what happens too often these days when people think doing everything client-side and client-side only is so “fancy” and that a “good” and “modern” site requires all that AJAX/one-page-only nonsense instead of a real good and working URL structure, and then are not able to handle all that this implies properly …)

Related

Share image including some attributes (e.g. description) on Facebook over web without app validation hassle

I want to share an image from a website on Facebook and pass some attributes (e.g. a description) to the status update, all done by clicking on a link.
A few months ago this worked fine using the sharer.php but by now this script just accepts a URL as parameter and scrapes the target site for Open Graph meta tags. This new approach isn't very helpfull if you just want to share elements on a page instead of the whole page.
Yeah, I could create an app and use the feed dialog to achieve my goal. But I honestly don't want to walk through the tedious app validation process just to share an image with some additional info!
So, does anyone know of a way to avoid this app hassle? Perhaps some undocumented parameters for the new implementation of the sharer.php?
There's no need for app validation - as #CBroe correctly stated! So the feed dialog IS an adequate solution!
Background: I assumed an app needs validation to go live. But I just didn't set up my app properly to make it available to every Facebook user.
See the comments to gloat over my stupidity. ;)

Share bought products from order on buyer's Facebook wall

The company I'm currently working for wants to create a button that lets people share their order on Facebook after they've paid, but with the deprecation of the "Share" button I don't really know how to do it.
The "Like" button does not seem fit for this. Any ideas, anyone?
There are a few ways to go about this.
You can use the standard sharer. This is good for one-off sharing or in cases where you don't have control or don't want to control how the share is rendered and you want Facebook to handle it.
http://www.facebook.com/sharer.php?u=<url to share>&t=<title of content>
It won't require you to have an app ID but you also won't get a nice control panel for your applications sharing history/insights. You can query and get some information about the URL your sharing though by looking through the open graph.
I.E
https://graph.facebook.com/?ids=http%3A%2F%2Fwww.cnn.com
https://graph.facebook.com/comments/?ids=http%3A%2F%2Fwww.cnn.com
You can set the URL and Title of the content. The sharer will then look at the metadata on the webpage your sharing to determine the contents of the share. More below.
You can also use the Feed dialog. Which comes with more customization options. The Feed dialog is the best option if your integrating sharing as an integral part of the application. I think at minimum you need to include the app_id,redirect_uri and link property. Look through the properties here. You will need an app ID to use this feed dialog and if your using the JS api you need to authenticate the user too. You can also invoke the dialog directly through a direct url where you don't need to pre-authenticate the user.
With either sharing method, you may wish to include custom open graph metatags on your webpage. This way you can influence how the Facebook scraper makes your share. You can set some default (pre-accepted by Facebook) open graph metatags on your page. Or you can create your own set now in the dashboard. In the Open Graph dashboard on Facebook you can customize how Facebook is supposed to read and interact with your metatags.
You can debug your pages open graph metatags by passing your URL through the debugger.
I.E
http://developers.facebook.com/tools/debug/og/object?q=www.cnn.com
This will give you, for example, JSON or an HTML representation of how FB sees the page.

Like button for Facebook page shows generic Facebook description in News Feed

I want a Like button on my web site that Likes my Facebook profile (rather than my web page), so that when a user clicks it they subscribe to my Facebook posts.
I've created the Like button using the tool at https://developers.facebook.com/docs/reference/plugins/like/
Further down that page there is an FAQ entry:
Can I link the Like button to my Facebook page?
Yes. Simply specify the URL of your Facebook page in the href
parameter of the button.
So, I've edited the href parameter to point to my Facebook page. eg:
https://www.facebook.com/myfacebookid
When a user clicks the Like button it has the desired effect. The user ends up having Liked my Facebook page. This is easily verified by the user going to my Facebook profile and checking that the Like button has changed to Liked.
But. When the user clicks the Like button, and entry appears in their News Feed with a generic Facebook description. ie:
Facebook is a social utility that connects people with friends and
others who work, study and live around them. People use Facebook to
keep up with friends, upload an unlimited number of photos, post links
and videos, and learn more about the people they meet.
I don't want a generic post about Facebook to appear. I want the description to relate to my Facebook account and/or web site.
Normally, I could modify this behavior with the Opengraph og: description tag, but as the page in the href is a Facebook page and not my own, I can't control the Opengraph tags.
I'm pretty sure that this was working okay before I enabled timeline for my account, so maybe this is a timeline bug?
So, how do I add a Like button which a) Likes my Facebook profile rather than one of my own web pages, and b) Posts a description of my Facebook profile rather than give a generic Facbook description?
Are all your fields in the info part of your page filled in, and/or completed? I just tested your theory and it seemed to work as expected, only thing is I know all fields in "info" are filled it. Give that a try.
This may happen if you have filled invalid/incomplete/wrong og tags in past and later changed them. Facebook's cache creates problem sometime.
Try putting all the entries (i.e. all og tags) and then debug them here http://developers.facebook.com/tools/debug. This debugger gives a detailed info about the url with og tags and also clears the cache for you.
This should solve the problem.
You have 3 important fields that used on page opengraph: Name,Description,Profile Image.
They are used when some one post your link on Facebook, or Google or some else web service that handle opengraph.
Actually, the suggested answers currently do not work and there is an open bug / ticket on Facebook for it. Up to now, there's no fix.
The problem is that you can not use simply https://www.facebook.com/myfacebookid. You should copy and paste the exact page URL. If you have a low number of likes it would look something like https://www.facebook.com/pages/[YourPageName]/[Your page Id]/, and this is the URL that you should use at this point.
If it does not work, try also https://www.facebook.com/[YourPageName]/[Your page Id]/.
In short, copy-paste the URL, do not type it manually.

Is it possible to combine a facebook page and a website in the social graph?

Facebook has "pages" for many things, like people, companies, etc. But it also has this open graph protocol. My company already has a web site, and we also have a facebook page (i.e. http://www.facebook.com/company)
People can "like" either one. We use a like iframe on the company website that refers to the website URL. I'd like to know if they can be connected such that when someone likes our facebook page, they really like our company's web site.
Or are these always going to be considered two different things?
To elaborate on puffpio's answer, you can have a like button for your existing page on you website by using the existing page's facebook url as the href parameter.
It is essential that you do not put a like button to your url if you do not want your likes split between the two. In this scenario there is no reason to have an open graph object for your page other than to provide correct data when a user shares your url in their feed. It's important to note that these shares also count towards the counter on the like button and as far as I know there is no way to recover them.
You can also use this url as your og:url tag however this will cause the linter to throw errors since the domains do not match.
No. Page and website is something different and you can't force user to like both
They are different things, but a workaround is that the like button on the company's website can be a like button for their page on Facebook with a caveat like 'Like us on Facebook' or something

When should use use "FB.Connect.showShareDialog" instead of "FB.Connect.streamPublish"?

It looks like they do virtually the same thing for simple posts. Do they show up in different place in Facebook? Any ideas?
Using FB.Connect.streamPublish you are allowed to specify attachments (image, flash, mp3), action_links, and a user_message_prompt. The posting to their Profile may be more engaging if you go this route.
The FB.Connect.showShareDialog is mainly just a url that you pass in. Facebook loads that url to get the page title, and see if there are suitable thumbnail images specified on that page.
The main advantage of showShareDialog is that you can ask the users to click on "Send as Message instead" to send the link to specific friends. The default behavior is to "Post to Profile instead".
For basic uses, the two calls can be very similar, but they each have their own distinct capabilities too. I'm finding that I have a need for both in different cases.