I've been reading through other related questions here, but I think they are even too advanced for where I am at with Facebook's coding and such...
I want to have a Facebook Comment box on my website. That is no problem and it works fine. I also want to be notified, on Facebook, when someone leaves a comment. I've tried numerous different things with the comment.create but I really don't have a clue what I am doing.
Can someone take me through this step-by-step and help me understand what I need to do? Here is what I've got:
<body>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=362160727158879";
fjs.parentNode.insertBefore(js, fjs);
}
</script>
<div class="fb-comments" data-href="{site name}" data-num-posts="10" data-width="650" notify="true"></div>
WX, I have a Classifieds app on Facebook. I needed to create some notification to the owner of the advertisement also. I solved that with a simple way, after a comment I manipulate the response from FB with Ajax and Jquery:
FB.Event.subscribe('comment.create', function(response) {
//Send an email with ajax
$.ajax({
type: "POST",
url: "sendcommentemail.php?",
data: "urlofpage=",
beforeSend: function() {
$('#loading').show();
},
success: function(html){
$('#loading').hide();
},
error: function(html){
}
});
});
good luck!
What you need is just add a friend in the app settings on the page as moderator.
He/she will get notification in their Facebook profile each time someone is commenting on your website.
Also, this tool is very handy and to be Favorited for people with developer accounts:
https://developers.facebook.com/tools/comments
Related
I am trying to get this Facebook Messenger Checkbox plugin working within a landing page, but it really won't behave and I can't crack why.
It's worth noting I am using Mobile Monkey for their chatbot feature. They provided a simple script which I embedded in the head and a div that you just place where you want the checkbox to display.
Of course, it's not showing, but I'm guessing it won't work without Facebook's integration?
I have including the Facebook SDK, Messenger SDK, etc. I even got the messenger checkbox to display for a short while, but now it's decided it would rather not show itself anymore. Here's everything I have included. If I am going wrong anywhere please let me know, I don't honestly know what I'm doing with all Facebook's developer features.
window.fbAsyncInit = function() {
FB.init({
appId : '(App ID is here)',
autoLogAppEvents : true,
xfbml : true,
version : 'v3.2'
});
FB.Event.subscribe('messenger_checkbox', function(e) {
console.log("messenger_checkbox event");
console.log(e);
if (e.event == 'rendered') {
console.log("Plugin was rendered");
} else if (e.event == 'checkbox') {
var checkboxState = e.state;
console.log("Checkbox state: " + checkboxState);
} else if (e.event == 'not_you') {
console.log("User clicked 'not you'");
} else if (e.event == 'hidden') {
console.log("Plugin was hidden");
}
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function confirmOptIn() {
FB.AppEvents.logEvent('MessengerCheckboxUserConfirmation', null, {
'app_id': '(App ID is here)',
'page_id': '(Page ID is here)',
'ref': '(Ref is here)',
'user_ref': '(User Ref is here)'
});
}
</script>
Is there anything missing here? From following all of Facebook's documentation this is all I should need to get the plugin working, but I may this wrong.
Regarding mobile monkey's little html element not working, their support is terrible and really don't seem willing to offer any help into this situation.
Did you check the browser version of chrome? I think the fb plugin is not loaded with the chrome version 74.
I know that there are various CTA cards that Facebook bot can use as seen here.
What I really need is a datepicker card that can be sent to the user where they can choose a date and send it back. Is this possible using Facebook bots?
Facebook messenger has not launched date and time picker in its templates.
But you can make you own with webview and Extensions help.
Follow these steps.
Create Button or Generic Template and put a button with
"buttons":[
{
"type":"web_url",
"url":"http://my_url_which_open_date_picker",
"title":"Select date",
"messenger_extensions": true,
"webview_height_ratio": "compact"
}
]
replace a url with your url.
NOTE: url should be in whitelist Your Domain
Now in that web page you can get userId of that particular user and couls easily map his actions for date picking.
On your page
<script>
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.com/en_US/messenger.Extensions.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'Messenger'));
</script>
When the Messenger Extensions JS SDK is done loading, it will call window.extAsyncInit and you will get userId in that function.
<script>
window.extAsyncInit = function() {
// the Messenger Extensions JS SDK is done loading
MessengerExtensions.getUserID(function success(uids) {
var psid = uids.psid;
}, function error(err) {
});
};
</script>
uids is Object containing user ids
psid Page-scoped user ID
You may also want to close your calander page when user picks date.
This can be done via:
<script>
MessengerExtensions.requestCloseBrowser(function success() {
}, function error(err) {
});
</script>
Is it possible to track users who like us or follow us on website. Also I want to track if some one unfollowing or unlike us. If there an api or any trick to do this?
Thanks to all
check out edge.create event - see more here: https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
edge.create - fired when the user likes something (fb:like).
edge.remove - fired when the user unlikes something (fb:like).
regarding capturing twitter event - see here: https://dev.twitter.com/docs/intents/events
Include widgets.js
<script type="text/javascript" charset="utf-8">
window.twttr = (function (d,s,id) {
var t, js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
js.src="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
}(document, "script", "twitter-wjs"));
</script>
Bind to an event when the user has clicked the Tweet Button:
twttr.events.bind('click', function(event) {
var click_type = event.region;
});
avs099 is correct and the link will provide some good info. But I thought I would post some further information to help others as they find this link.
I used the FB.init() function to call a setup function that creates the callback functions for the edge.create and edge.remove.
FB.Event.subscribe('edge.create',
function(response) {
alert('You liked the URL: ' + response);
//ajax back to the server.
var xmlhttp;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("POST", "YourCapturePage.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send(response + "&add=1");
});
YourCapturePage.php or what ever processing page can then parse the response and add a record to your database back-end to track the usage of your like button on a given page. The response contains the info about what page was liked. Then you can do something similar for the edge.remove.
I am building facebook iframe app. My application is loaded once (I receive signed_request once) and then I navigate through the pages in the iframe using internal domain links. I noticed that I see these strange messages both in Chrome and Firefox
FB.init has already been called - this could indicate a problem
I am pretty sure that this method is called only once and it seems Facebook wants me to call it once per application load (not once per page).
window.fbAsyncInit = function() {
FB.init({
appId: param('facebook_app_id'),
frictionlessRequests: true,
oauth: true,
channelUrl: site_url('/channel.html')
})
}
What error (if any) am I making here?
From the moment you pass parameters to the js.src like #xfbml=1&appId=X, FB SDK will auto init itself and thus FB.init will try to reinit..
So in your code, you don't have to remove the FB.init function, just make sure you don't pass parameters in the code that loads asynchronously the JS SDK.
Replace this:
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=X";
With :
js.src = "//connect.facebook.net/en_US/sdk.js";
If you really need to call init more than once you can do this:
FB._initialized = false;
FB.init();
but it makes no sense to me, I have a little bit different problem, but it is also related to FB.init has already been called - this could indicate a problem message.
I have AJAX-based website where after each page load I need to render XFBML from HTML that I get from AJAX request (comments, like button and other):
<div class="fb-comments" data-href="{REMOVED}" data-num-posts="5" data-width="760" colorscheme="dark"></div>
To do this, you can run this when you need to render XFBML:
FB.XFBML.parse();
I've also had this problem. I simply removed FB.init({...}) part and it started to work with following code:
window.fbAsyncInit = function () {
FB.Event.subscribe('auth.logout', function () {
// subscribe parts
});
// here is where fb.init() code was
};
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=X";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
I guess it now auto inits code, so there is no need to do it manually. Now my code works again. I hope this helps.
On external website (not fb page) would like to put like button where once visitor click like button , it shows certain content.
Here is the code i might thinking it works if i'm not wrong but needs more help !
<div id="fb-root"></div>
<fb:like send="false" layout="button_count" width="100" show_faces="false"></fb:like>
<div id="hidden_content" style="display:none;">Thank You Dear</div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId : '185373538XXXXXX', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
FB.Event.subscribe('edge.create', function() {
$('#hidden_content').show();
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
So any idea !
~Thanks a lot
Here's my idea (since you're looking for ideas and references).
edge.create will only fire when a user likes the link. You will need to account for what happens when a user comes to your page that previously liked it. I would suggest looking for a way to determine if the like has showed up.
Here's some documentation to read thru:
This might get you the graph id of your web page's url via the object_url table
SELECT url, id, type, site FROM object_url WHERE url = "http://developers.facebook.com/"
Then see if you can track it down in either a stream posting or in a like