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 Popup Or Dialog And Call Back

Facebook Publish To Wall With Popup Or Dialog And Call Back

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>

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

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

Example Publish To Wall With Popup Windows

Example Publish To Wall With Popup Windows

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>

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

Example Publish To Wall With Dialog

Example Publish To Wall With Dialog

Sep 8, 2011Hoan Huynh

Source Code Demo page

How To Delete Application In Facebook DevelopersHow To Track Website With Multiple Google Analytisc Accounts
You Might Also Like:
  • Facebook Publish To Wall With External Link And Track Callback
  • Auto Load YouTube Video As A Popup With JQuery FancyBox
  • Facebook Removed View App Profile Page link For New Apps
  • Facebook Like Button And Recommend Button With fb:like, iframe and html5
  • Get Image Width Height With JQuery And JavaScript
  • PHP Change Facebook Profile Picture With Graph API
  • PHP Call Web Service WSDL Example
  • How To Ask People To Like Your Facebook Page On The Landing Page
  • How To Track Website With Multiple Google Analytisc Accounts
  • JQuery How to use DatePicker
Hoan Huynh

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

9 years ago Facebook Graph APIFacebook, Facebook Connect633
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,485 views
Notepad Plus Plus Compare Plugin
How To Install Compare Text Plugin In Notepad Plus Plus
20,284 views
Microsoft SQL Server 2008 Attach Remove Log
Delete, Shrink, Eliminate Transaction Log .LDF File
16,043 views
JQuery Allow only numeric characters or only alphabet characters in textbox
13,519 views
C# Read Json From URL And Parse/Deserialize Json
10,067 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
  • Online Payday Loans – Learn How To Make the Most of A Alternative Lending Option
  • Strategies For Buying Photo Editor Software
  • Where to Find the Greatest Free Photo Editor on the Web
  • Custom Research Paper – What’s it So Useful?

  • Getting Bad Credit Paydayloans From a Reputable Source
Categories
  • CSharp (45)
  • Facebook Graph API (19)
  • Google API (7)
  • Internet (87)
  • iPhone XCode (8)
  • Javascript (35)
  • Linux (27)
  • MySQL (16)
  • PHP (84)
  • Problem Issue Error (29)
  • Resources (32)
  • SQL Server (25)
  • Timeline (5)
  • Tips And Tricks (141)
  • Uncategorized (247)
Recommended
  • Custom Software Development Company
  • Online Useful Tools
  • Premium Themes
  • VPS
2014 © 4 Rapid Development