How does the Facebook 'share' button on Stack overflow work? - php

I am looking to add social icons to our site, giving customers the ability to "like", tweet and share content on their facebook and twitter profiles. I have noticed to the left of this box, the facebook and twitter icons do exactly what I am trying to accomplish but I am not familiar with how to do this. Looking at the source code, there are JS references to:
<script type="text/javascript">
StackExchange.ready(function() {
var shareUrl = "http%3a%2f%2fstackoverflow.com%2fq%2f7505636%2f337690";
var shareMsg = "Advice+integrating+Facebook+%27share%27+and+link%2fimage+capabilities+with+our+site";
StackExchange.share.facebook($("#fb-share-7505636"), shareUrl, shareMsg);
StackExchange.share.twitter($("#twitter-share-7505636"), shareUrl, shareMsg);
});
</script>
Our site works this way: While anybody can visit the primary site at any time, individuals can sign up as representatives with their own unique URL that acts as a referrer to give 'credit' on rewards. I have reviewed the facebook developer site and to be honest I am slightly overwhelmed. I want to give our members the ability to click a Facebook icon from within their dashboard, prompting them to post on their wall with a set image, set title, and description. I have read in the documentation this is done by setting meta tags in the head but it does not seem to matter for my site (or I am clearly doing it wrong).
What if the URL facebook is looking for (share URL) is behind a password protected page or an area of the site which would not allow content based on a missing PHP SESSION variable?
Edit
I have also seen a lot on the net which says I have to integrate the Facebook JS SDK but then goes on to talk about authentication/permission to write on walls, etc. Yes the link to the left does not ask for permission to do anything other than to 1) log into the FB account, 2) post on the user's wall.
This site is a perfect example
The link above is great but it assumes I need to authorize a 'share' which does not occur on this site.

When you click on the share button, you call a script on facebook.com that will then in turn access the page pointed to in the querystring (?u=xxxxxx).
Facebook will parse that page and grab the first few images it finds, a description and title from the page. That is what it shows to you and allows you to add some additional text (as well as edit the title/description/and choose different images).
If that page contains the specific meta tags that facebook asks you to add to the page, then they'll use those to populate the title/description/image. This allows the webpage author to control how their page shows up in a facebook feed (although the user could still edit it before posting). These meta tags would need to be in that particular page to be used by facebook.
If facebook cannot access the page because it's password protected, etc. - then it cannot parse the meta tags and will then just show the user the URL as the title with no description and thumbnail.

Related

Social sharing with custom text, url and image

My requirement is to share a URL/page that is accessible only after the login!! sounds weird and meaningless but that's the requirement!! The problem is I can not use Open graph because facebook, twitter, and other social media who use Open graph will always take the title, text, and image of the login page from the meta information. So I searched and googled to get a way around to share the private URL with custom text, image, and URL. I have created some POC and have followed some plugins but nothing is helping me out.
I followed this article of "Share this":- https://www.sharethis.com/support/legacy/how-to-customize-which-url-text-and-img-to-share/ ( need to change button js to https://ws.sharethis.com/button/buttons.js )
This option is working fine for email sharing but social media is fetching the Login page meta always.
I followed this article for "Add this":- https://www.addthis.com/academy/setting-the-url-title-to-share/ (this seems to be old and they don't specify the date of the article!! )
This option is also not working and does not solve what is required.
So my question is it possible to share the page with custom title, image or description that is not accessible without login ?? if yes then any idea how to achieve this without Meta, Open graph, schema.org etc.
You tried to use OpenGraph tags on pages which require login. Facebook, Twitter and etc cannot access through obviously. Try to somehow recognize social media that request your protected content and give it to them.

How to show a special page overlay to users who are on iPhone?

If you visit webmd from your computer you see one page, but if you visit webmd from an iPhone not only do you get their mobile page (which is easily enough done), they also show you a special overlay with a "click to close" button which invites you to download their app.
Is there a component anywhere for this? Does anyone have any starters, links, or hints about the best way to go about doing this? I guess in principal it's like a lightbox for photos but I'm looking for something specifically to invite downloads of the app.
It's called a smart app banner
You basically add a special meta tag to your html
<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">
Include the app store id for the app you want to link to. app-argument url will be passed to the appropriate AppDelegate method.

What's up with Facebook Pages why is there fragmentation

I'm trying to figure out why Facebook is creating fragmentation with its pages. I really don't understand it. Also is there anything that can be done about this.
Here is a perfect example I have my Facebook company page for "Scoreoid" (http://www.facebook.com/pages/Scoreoid/245182948843019) this has my content wall post's, photos ect..
Then I have this page which I guess is only connected to the Scoreoid website which is new and was automatically done http://www.facebook.com/pages/Scoreoid-the-ultimate-game-platform-for-developers/269861406410210
This is the page for the Scoreoid site which has 130 likes but of course on Facebook it only shows 15 another question either way why is there two pages why can't everything be connected to one page.
All this does is create fragmentation which is noting but bad user experiences.
It would max sense to have everything directed to the Facebook main page. Of course I have other questions for which do I run advertising on which should I update with content?
I've already answered you here two weeks ago:
Facebook Likes not showing on Facebook page but show up on site
Facebook pages like counts are NOT THE SAME as like counts for a web site. They cannot be joined by Facebook as they are two separate IDs. You can have your parsing scripts add together the two like counts yourself.
This has been my experience. If you add the open graph meta tags (og:url, og:image, og:type, etc.) Facebook will create a "facebook page", but this page will only be accessable by you. This is the message that facebook will show on this open graph page: http://snag.gy/z9UfG.jpg
If besides this you create another page then it will not be linked with this page. I recommend you use the page you created as that page is accessible by everyone.
If this is not your case then please clarify.

Integrate facebook Like button for a specific element of my website

I have a website where i implement a wall of messages, the idea is to add to each of this wall messages a like button, where clicking on it would immediately post on the user's facebook profile page that he likes THAT SPECIFIC COMMENT.
Is this possible? I just enter this new world of facebook php developers, and as far as I have read here it always talks about adding a Like button for a specific URL. I would like to make the like button apply for the specific post within the messages wall.
I am clueless as where to start, if by the way any one could recommend a detailed tutorial on how to integrate a website to facebook in its different ways, i would really appreciate it.
EDIT:
Looking into #Kaan Soral suggestion of using open graph, I think it is important to add that I dont want each wall post that the user likes to appear in the "Likes and Interests" section of his profile... This wouldn't make sense because he would rapidly have loads of likes of separate wall posts.
Its possible, read this: http://developers.facebook.com/docs/opengraph/
You have to create a URL for every item that will be liked and on that URL there should be META tags for descriptions, image etc

Facebook share button for website

i need to use share button in my website. Different share button for different products.. mostly we need to use like this,
http://www.facebook.com/sharer.php?
In the above url what are all the parameters we need to pass for showing it as our website, product and some image of that product in that share page...
You asked what parameters you need to pass it to have it show up as your site, etc. The like button uses its own Graph Protocol API to do this, it essentially makes your page a facebook page and can be read as such. It's written like XML and defines things such as the thumbnail you want to show as your picture, the shortname of the site, etc. Go to developers.facebook.com to read all about the facebook API and app development and integrating into your webpage, etc.
you cand use this on github to share content on social media (includes facebook) and make your custom button!
You can use Facebook Like also. It performs the same as the Facebook share now appearing in your Facebook newsfeed with thumbnail, or
You can use some plugins like add this or you can use the following link:
<a name="fb_share" type="button" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>

Categories