Truemag

  • Categories
    • Tips And Tricks
    • Internet
    • PHP
    • Javascript
    • CSharp
    • SQL Server
    • Linux
  • Lastest Videos
  • Our Demos
  • About
  • Contact
  • Home
  • Write With Us
  • Job Request
Home Facebook Graph API Facebook Publish To Wall With External Link And Track Callback

Facebook Publish To Wall With External Link And Track Callback

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

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>

<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

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();
	}
?>

<?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.

Sep 30, 2011Hoan Huynh
Facebook Load User Profile Via Graph API And FQL QueryHow To Add New Administrators To Facebook App
You Might Also Like:
  • Facebook Publish To Wall With Popup Or Dialog And Call Back
  • How To Track Website With Multiple Google Analytisc Accounts
  • Get WordPress Short Link And Full Link To A Post
  • Submit Content To facebook Fan Page Automatically
  • Share Link/ Url Of Facebook, Twitter, Google Plus, Stumbleupon, Reddit, Digg and Tumblr
  • Facebook Like Button And Recommend Button With fb:like, iframe and html5
  • PHP Change Facebook Profile Picture With Graph API
  • Facebook Removed View App Profile Page link For New Apps
  • PHP Get Likes Number Of Facebook Page
  • How To Ask People To Like Your Facebook Page On The Landing Page
Hoan Huynh

Hoan Huynh is the founder and head of 4rapiddev.com. Reach him at [email protected]

9 years ago Facebook Graph APIFacebook, Feed Dialog495
0
GooglePlus
0
Facebook
0
Twitter
0
Digg
0
Delicious
0
Stumbleupon
0
Linkedin
0
Pinterest
Most Viewed
PHP Download Image Or File From URL
22,196 views
Notepad Plus Plus Compare Plugin
How To Install Compare Text Plugin In Notepad Plus Plus
20,069 views
Microsoft SQL Server 2008 Attach Remove Log
Delete, Shrink, Eliminate Transaction Log .LDF File
15,847 views
JQuery Allow only numeric characters or only alphabet characters in textbox
13,323 views
C# Read Json From URL And Parse/Deserialize Json
9,815 views
4 Rapid Development is a central page that is targeted at newbie and professional programmers, database administrators, system admin, web masters and bloggers.
Recent Posts
  • Free Online Photo Editor
  • Easy Tips For Writing An Essay
  • What Can I Expect From An Academic Essay Service?

  • Can Be Essay Service Companies Good For You?

  • Tips To Choosing The Ideal Essay Writers
Categories
  • CSharp (45)
  • Facebook Graph API (19)
  • Google API (7)
  • Internet (87)
  • iPhone XCode (8)
  • Javascript (35)
  • Linux (28)
  • MySQL (16)
  • PHP (84)
  • Problem Issue Error (29)
  • Resources (32)
  • SQL Server (25)
  • Timeline (5)
  • Tips And Tricks (141)
  • Uncategorized (112)
Recommended
  • Custom Software Development Company
  • Online Useful Tools
  • Premium Themes
  • VPS
2014 © 4 Rapid Development