This is just a demonstration on How to allow people post something to their Wall directly on your website with a Popup windows or default Facebook Dialog. After they submit a message or cancel the action, a call back function will be trigger do to something such as posting Ajax to update database to give them a reward or just show thank you message.
In this example, you need to load the Facebook Connect JS file and replace my Facebook Application ID with yours.
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script> <div id="fb-root"></div> <script type="text/javascript"> window.fbAsyncInit = function() { FB.init({ appId : '173129869824', // should be replaced with your Facebook Application ID status : true, // check login status cookie : true, // enable cookies to allow the server to access the session xfbml : true // parse XFBML }); }; </script> |
1. Example Publish To Wall With Popup Windows
<script type="text/javascript"> function streampublish_popup(){ FB.ui( { method: 'stream.publish', attachment: { name: 'Demo Pulish To Wall With Popup And Call Back Function', description: ( "I have experienced with Share On Wall with Popup windows and would like to share with you. Check it now." ), href: "http://4rapiddev.com/facebook-graph-api/facebook-publish-to-wall-with-popup-or-dialog-and-call-back/", media: [ { 'type':'image', 'src':'http://4rapiddev.com/wp-content/uploads/2011/09/Example-Publish-To-Wall-With-Popup-Windows.jpg', 'href':'http://4rapiddev.com/facebook-graph-api/facebook-publish-to-wall-with-popup-or-dialog-and-call-back/' } ] }, display: 'popup' }, function(response) { if (response && response.post_id) { alert('Post was published with post_id:' + response.post_id); } else { alert('Post was not published.'); } }); } </script> |
2. Example Publish To Wall With Dialog
<script type="text/javascript"> function streampublish_dialogs() { FB.ui( { method: 'feed', name: 'Demo Pulish To Wall With Dialog And Call Back Function', link: 'http://4rapiddev.com/facebook-graph-api/facebook-publish-to-wall-with-popup-or-dialog-and-call-back/', picture: 'http://4rapiddev.com/wp-content/uploads/2011/09/Example-Publish-To-Wall-With-Dialog.jpg', description: 'I have experienced with Share On Wall with Facebook Dialog and would like to share with you. Check it now.' }, function(response) { if (response && response.post_id) { alert('Post was published with post_id:' + response.post_id); } else { alert('Post was not published.'); } } ); } </script> |