what it means and how to do it David Hunt http://dnotes.net October · 2011
Disclaimer: This is primarily about integrating a Drupal website with Facebook. It does not cover all aspects of Facebook application development.
“…and also, the site should be integrated with Facebook.” all the different ways to integrate with Facebook
integrating with facebook to the public to Facebook users on a public url on a Facebook url Facebook content: your content: in an iFrame in an iFrame through Facebook’s api only. http://www.insidefacebook.com/2011/04/22/canvas-connect-websites-best/
Notifications The way that people get friends News Feeds information on Facebook Ticker (the full presentation shows pictures; if you are not familiar with these, the rest won’t make sense.) Timeline Timeline Views user This is not a complete list. Facebook has other social channels beyond these, such as Likes recommendations, but I find these to be the Interests most useful for a website. On a FB Page fb While I have found no comprehensive list of In a FB Group all social channels available, many are on page mentioned on the developer help pages: In an iFrame Natively developer.facebook.com * that I think are relevant to the most website integrations
Sharing Social Plugins Opengraph protocol Liking Facebook Pages Facebook Apps Opengraph : Custom Connections Apps : Login through Facebook Canvas Pages / Tabbed Pages * that I think are relevant to the most website integrations
sharing Notifications friends News Feeds Ticker Timeline Timeline Views user Likes Interests On a FB Page fb In a FB Group on page In an iFrame Natively http://weorme.bandcamp.com/track/know
social plugins Facebook iFrames on YOUR website http://david-hunt-music.com/store/cds/earth-and-eagle.html
social plugins Simple Plugins: Notifications friends opengraph like button optional News Feeds send button Ticker comments activity feed Timeline recommendations Timeline Views user FB Page Plugins Likes like box Interests opengraph facepile required On a FB Page App Plugins fb login / registration In a FB Group facepile on page In an iFrame live stream Natively add to timeline
opengraph protocol Open Graph objects are annotated web pages with a set of tags which provide the property value. The properties on an object include the title, description, and any custom properties. Objects are connected to users via actions, and when this happens, an object will appear in Timeline, News Feed and Ticker. https://developers.facebook.com/docs/beta/opengraph/internationalization/
opengraph protocol It’s about the connections between things. Subject Action Object Subject Action Object David Hunt like Sleeping City by We/Or/Me facebook.com/davidhuntmusic weorme.bandcamp.com/album/sleeping-city David Hunt “friend” Joseph Schmoe facebook.com/davidhuntmusic facebook.com/joeschmoe Donald Duck like Daisy Duck facebook.com/DonaldDuck facebook.com/DisneyDaisyDuck … … …
opengraph protocol It’s a catalog of all existing things — and some that don’t exist— and the relationships between them. Everything in the opengraph has an ID number David Hunt: 510997137 (or davidhuntmusic) Donald Duck: 134229524276 (or DonaldDuck) Peace on Earth: 146985261982733 (etc.) visit http://graph.facebook.com/# to see all about an object Opengraph objects include: Album, Application, Event, Group, Link, Message, Note, Page, Photo, Status message, Subscription, User… (and more) All objects have connections Add ?metadata=1 to see connections You can read connections http://graph.facebook.com/DonaldDuck/photos You can write connections …if you have the right OAuth 2.0 access token https://developers.facebook.com/docs/reference/api/
opengraph protocol Use the proper meta tags . <head> ... <meta property="og:type" content="album" /> <meta property="og:url" content="http://david-hunt-music.com/store/cds/ earth-and-eagle.html" /> <meta property="og:title" content="The Earth and the Eagle" /> <meta property="og:image" content="http://david-hunt-music.com/imagecache/ opengraph_thumbnail/davidhunt.png" /> <meta property="og:site_name" content="David Hunt" /> <meta property="og:description" content="This was my first CD, the best og:type songs from my late teens and early twenties. I think this album is og:url mostly about figuring out what it means to be a human being." /> <meta property="fb:admins" content="510997137" /> og:title <meta property="fb:app_id" content="176208815755315" /> ... og:image </head> http://david-hunt-music.com/store/cds/earth-and-eagle.html og:site_name og:description Important URL: fb:admins http://developers.facebook.com/tools/debug fb:app_id
liking … without Opengraph: Notifications friends News Feeds Ticker … with basic Opengraph: Timeline <meta property=“og: title ” content=“How to connect a page” /> Timeline Views user <meta property=“og: type ” content=“article” /> <meta property=“og: url ” content=“http://path.to/url” /> Likes <meta property=“og: image ” content=“http://path.to/img.jpg” /> Interests … with app_id: On a FB Page fb <meta property=“fb: app _ id ” content=“How to connect a page” /> <meta property=“fb: admins ” content=“article” /> In a FB Group on page … with certain “og:type”s: In an iFrame for a list, see https://developers.facebook.com/docs/opengraph/#types Natively
facebook pages Opengraph objects Created on Facebook or externally with Opengraph meta tags.
facebook pages Pages are public. Notifications friends Anyone can like a page News Feeds But you can block them Ticker Page administrators can: Invite friends Timeline Post status updates Timeline Views user Use a like box (on your website) Likes Promote with ads View statistics Interests …and more. On a FB Page How are page administrators fb declared in Opengraph meta tags? In a FB Group fb:admins (Opengraph ids) on page In an iFrame fb:app_id (Opengraph id) Natively https://www.facebook.com/help?page=904
facebook apps a Facebook “canvas” that displays your content in an API key. an iFrame in the context of Facebook.
facebook apps Manage their own pages, streams, etc. these can be used to communicate with subscribers through their news feeds, tickers, etc. Define custom Opengraph objects & connections Manage user accounts on your website your user accounts can be linked to their facebook accounts Manage fb users’ data (if they authorize you) Obtain data about users and friends, such as events, groups, photos, videos, likes, location, birthday, hometown, checkins, etc. Read their mail Create and manage events as that user Read their notifications and mark them as read Publish actions to their stream Communicate with them via SMS Masquerade as and manage their pages https://developers.facebook.com/docs/reference/api/permissions
apps : custom connections Notifications Food review site: friends News Feeds David : likes : sage potatoes Ticker Social recipe sharing site: Timeline David : cooked : sage potatoes Timeline Views user Likes Interests On a FB Page fb authorize app “action” a page the app posts In a FB Group on page In an iFrame Natively https://developers.facebook.com/docs/beta/opengraph https://developers.facebook.com/docs/beta/opengraph/tutorial
apps : facebook login Notifications Not always a login to Drupal! friends News Feeds Login through Facebook Ticker authorizes your app. It does not necessarily login to Timeline Drupal, as some of Facebook’s Timeline Views user docmentation suggests. Likes Interests May login to Drupal, and On a FB Page May create a Drupal user fb In a FB Group if you set it up. on page In an iFrame Natively
apps : canvas and tab pages “App on Facebook” will let you Notifications friends build a dynamic web page and News Feeds then display it on in an iFrame as Ticker a Facebook page. Timeline “Page Tab” will let you build a Timeline Views user dynamic web page and then Likes display it (in an iFrame) as a tab that many people can put on their Interests Facebook pages. On a FB Page fb Your dynamic web page can be In a FB Group written in any language that on page In an iFrame accepts post requests, like PHP. Natively search YouTube for “create custom tabs facebook iframes ”
review : what does what Notifications friends News Feeds Drupal Ticker Timeline Support Timeline Views user Likes Level Interests On a FB Page fb In a FB Group on page In an iFrame Natively
how to do it Use one of the many Drupal modules addtoany addthis sharethis etc. etc. Implement your own share button https://developers.facebook.com/docs/share/ NOTE: share is deprecated. …but it still works.
Recommend
More recommend