A simple JavaScript example below will use the Facebook FB.ui function to display the Feed Dialog for users be able to post a link (with picture, caption and description) to their Wall.
By default, Facebook doesn’t allow to post an external link, it must direct to the application’s connect or canvas URL. However, we can do a trick here by adding a query string parameter in the URL and determine that parameter in the application page then redirect to a proper external URL.
It also will check result in a callback function which executes after the function completes based on its response. In this example, a post id should be displayed if people share something or else will display an alert.
Facebook Publish To Wall FB UI Feed Method
1. JavaScript Post To Wall Using Facebook FB.ui function and feed method
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="https://www.facebook.com/2008/fbml"> <head> <title>Publish To Wall Facebook Example</title> </head> <body> <h3>Public to Wall demostration</h3> <div id='fb-root'></div> <script src='http://connect.facebook.net/en_US/all.js'></script> <input type="button" onclick="publishToFeed(); return false;" value="Post to Wall with FB.ui feed method"/> <p id='msg'></p> <script> FB.init( { appId: "246714398703948", status: true, cookie: true }); function publishToFeed() { var obj = { method: 'feed', link: 'http://apps.facebook.com/rapid-apps/?pid=2268', picture: 'http://4rapiddev.com/wp-content/uploads/2011/09/Facebook-Publish-To-Wall-FB-UI-Feed-Method.jpg', name: 'Publish To Wall With External Link And Track Callback', caption: 'With a simple JavaScript example', description: 'It displays the Feed Dialog for users be able to post a link (with picture, caption and description) to their Wall' }; function callback(response) { if (response && response.post_id) { document.getElementById('msg').innerHTML = "Post ID: " + response['post_id']; } else { alert("You clicked Cancel button, don't you want to share?"); } } FB.ui(obj, callback); } </script> </body> </html> |
Facebook Publish To Wall FB UI Feed Method Demostration
2. PHP redirect to a proper external link
The piece of PHP code below should be placed on the top of your index.php page of the application. It will determine the “pid” query string parameter and redirect to a proper link.
<?php if(isset($_REQUEST["pid"]) && $_REQUEST["pid"] != "") { $redirect_url = "http://4rapiddev.com/?p=" . $_REQUEST["pid"]; echo "<script type='text/javascript'>top.location.href = '$redirect_url';</script>"; exit(); } ?> |
+ View demonstration on my Facebook page
+ Download the JavaScript source code above.
