Social Networking Website Enhancements

This page details the social networking website enhancements I have added to my site.


Sharing your website URLs on Facebook

This section details how to enable sharing details for your web pages when used with Facebook.

Example Shared URL

Here are some examples of how the URL http://www.dnabuddy.org/ looks when shared on Facebook.

Facebook share of www.dnabuddy.org

Screenshot 1: Facebook share of
www.dnabuddy.org

Example Shared Video

Here is are examples of how a video is available, for the URL http://www.dnabuddy.org/ shared above, when the play button is pressed on Facebook.

Facebook share of www.dnabuddy.org

Screenshot 2: Facebook shared video for
www.dnabuddy.org

Share Description

Here is the HTML Meta Property to pass Facebook the page title and description.

Share Images

Here is the HTML Meta Property to pass Facebook an image for the page.

Share Video

To get immediate playback to occur on Facebook when somebody clicks the play button on the content shared for your URL. I noticed that it is best to use flash video.

Here is the HTML Meta Property to point Facebook to the following config.js file.

Here is the Javascript config.js used to share the video on the http://www.dnabuddy.org/ site URL.

Other Share Properties

Facebook asks that you add some additional HTML Meta Properties to your page.

Details about these additional tags that may be supported by Facebook may be found on the Open Graph Protocol.
http://developers.facebook.com/docs/opengraph/.

Getting Flowplayer

I used the free Flowplayer application to enable Facebook share videos on my web sites.

Flowplayer may be downloaded from:
http://flowplayer.org/.

Flowplayer RTMP plugin may be downloaded from:
http://flowplayer.org/plugins/streaming/rtmp.html.

I created a flowplayer folder on my web server under the root folder. I installed the 3 Flowplayer files in this folder.

Facebook URL Linter

Facebook caches the share details for URLs. If you decide to modify your share details you will need to submit a request to refresh the page details.

The Facebook URL Linter web page is found at:
http://developers.facebook.com/tools/lint/.

Enter the URL of the page you modified, before trying to share it on Facebook and then press Lint.