Facebook select friends and post UIDs to custom URL - javascript

I'm building a facebook connect application, and here's the specific use case I'm trying to solve (using the Facebook Connect Javascript toolkit - http://github.com/facebook/connect-js)
There is a link on a page that a user clicks to "invite friends".
This click opens up a facebook friend selector widget (something like the multi-friend-selector), and the user selects friends from it.
The selected friends are POST-ed to a custom URL using an Ajax call and the selector widget goes away.
I'm able to do steps 1 and 2 using a fb:request-form and fb:multi-friend-selector. However, by default that posts to facebook and redirects the page. Is there a way to simply retrieve the UIDs of the selected users and then post them to a custom URL instead?

This topic is muddy water right now.
The current way is to implement your custom URL with an fb:req-choice in the content attribute of your fb:request-form as described here.
But as you can clearly see on that page - they are soon deprecating that element and changing how requests/invites work in general. So you can implement it like this for now, but will probably have to change it when they release more details about the new system.

Related

Application Insights - is it right to use href as "View page name"?

As I know, Application Insights uses page title as View page name. But my application has simillar page title for all pages. And that is why I always get only one pageview and can`t create propper userflow graph, because AI displays, that user visit only one page all the time.
User flow graph with one pageview
That is why I added this TelemetryInitializer on client side to track pageview by href but I am not shure if it is a right approach.
const telemetryInitializer = envelope => {
envelope.baseData.name = window.location.href;
};
appInsights.addTelemetryInitializer(telemetryInitializer);
Maybe Azure Team has any other way to do it without changing page title?
There are a variety of ways to approach this. Application Insights User Flows starts from a page view, custom event, or exception that you specify. In my example below, I've used custom events. A custom event in JavaScript might look like this:
appInsights.trackEvent({name:"SuccessfulUserLogin"});
(For detailed instructions on how to log custom events, see the documentation on TrackEvent.)
Here I've used the custom event "SuccessfulUserLogin" as the Initial Event in Application Insights to create a User Flows graph:
That in turn allowed me to track the user flow using the custom events that I specified on other pages (tracking the custom event "VisitedUserForum" on the user forum page and "VisitedFeedbackForum" on the feedback forum page even if both pages were named "forums"):

Social media functionality on website

Im totally new to integrating social media with a website so this is a bit of a scattershot question. There is no doubt questions on here answering this already but as im not sure what im looking for yet, im not sure how to find them.
Okay so my company wants to promote their twitter and facebook profiles as customer service avenues, so users will ask questions on there rather than calling or emailing.
Ive built quite a funky page promoting this, however the links are literally just links to the facebook and twitter pages.
Is there a method to load a window to twitter or facebook from a website link that will prompt a user to type and submit a question to be submitted the the FB/twitter feed? Or is there a way to take content from a text box on site and pass this through to FB/Twitter?
Basically just looking for something slightly cooler and more user friendly than just dumping them on the companies FB or twitter page on click.
Cheers,
Found the solution I was looking for that works for twitter, its simply passing values through a URL, details are here https://about.twitter.com/resources/buttons#mention.
For facebook, seem to be able to do this through the comments module. Seems like a lot of this can be edited through the API so a combination of both should give me what i need:
https://developers.facebook.com/docs/plugins/comments/
use this website as an idea on pushing content into tweets
http://www.sharelinkgenerator.com/
example for twitter: the href on your link would be:
https://twitter.com/home?status=your%20content%20here
if you wanted dynamic content, you would build the url using script.
same rules apply for facebook.
if you wanted to keep it within your website, maybe look into a fixed position div containing an iframe.

HTML using jQuery to send a postback?

I am creating a website for a clothing brand but am still getting started with my web dev work. I have an index page with several clothing items on it. When a user hovers over the picture of the item then a hover over effect comes into play and a small "View Item" appears over the item. When the user clicks this "View Item" text it opens a new page with that particular page's info.
The part I am struggling with is how I send the parameter to this item page as I will need some way of knowing what item was clicked. Can I write a jQuery function that will fire when the text is clicked and perform a .post() method to the item.php page passing along the item ID ?
So it would be something like
$.(document).ready( function() {
$("#itemText").click( function() {
$.post("item.php", parameters);
});
})
POST isn't the proper protocol for that. Use GET instead.
GET is vary easy to use with HTML links; it is what happens every time you click a link on a website. Say the page is "products." If the user clicked on product 1, than the URL for that page could potentially be "products/?id=1" (or products/1 if you are using mod_rewrite). The "id" variable with a value of "1" will be available to the PHP via $_GET['id']. With that variable, you can retrieve the proper information based on the id.
POST is for forms where users are submitting fields of data or images. http://html.net/tutorials/php/lesson10.php
If you are attempting to build a pure Javascript solution, then that is an entirely different matter. In that situation you would use Hash tags or HTML5 History API to change the URL. When the URL changes, Javascript is notified, and then whatever actions can occur. However, based on the fact that you specifically said "POST" I am assuming you are using a server-side language like PHP.
If you are opening a new page, you should not POST. If you must POST, you should POST then Redirect, although since you are not actually performing an action I recommend just sticking with a GET request. This way the newly opened page can easily be refreshed and shared by the viewer.
The most elegant way is to use rewrite rules or a router on your server so you can communicate which item to display, for example: http://example.com/item/1/
However you can also just use a GET parameter: http://example.com/item/?id=1
If you need to communicate to Javascript that will be executed on a page you can also use a hash: http://example.com/item/#1
There are several options using GET depending on how you display the item information, and what server-side technology you use.

When updating a url/html title dynamically, how can I get a facebook like button to register the change? (NOT the href in fb:like)

I have a webapp that changes the url using window.history.pushState() based on the content that is dynamically loaded. I also have a facebook like button on the page that corresponds to the current element/url (also changed dynamically), and I also change the title of the page (document.title).
When I click the button when it's running, the update on facebook says "User likes this link". The link is the correct link going to the right URL, but beneath it is a little message that says
Original Title
Original URL
How can I get the facebook update to instead read:
Updated Title
Updated URL
Best,
Sami
EDIT:
Alternatively, does anybody know how to change the message that the facebook like button posts? If I could create my own message, I could easily fix this.
It looks like this question has been answered before here Update FB:Like URL Dynamically using JavaScript
there are a number of different solutions given
Edit to answer the clarified question:
The problem is recounted here Facebook Share doesn't pick up title / description meta tags that are changed after page load
To summarize: Facebook scrapes and caches your page title and description, the information is not submitted by the client.
One way around this is to have your server parse the hash or query string, as your javascript would, and serve a page with the title you want.

Facebook Share Customize Message Field

How can I customize the message field with Facebook share... You used to be able able to use one of the share URLs with a ?message= parameter but that no longer works... Here is what I currently use for the contents but I can't change the users default post:
FBshare
Using URL-Javascript I can alter the innerHTML of the post-field's text-area after I have gone to the URL... but I guess I can't send that information after the user has gone to the Facebook URL and left my page right?
I do believe that the old sharer.php is in the process of being deprecated.
You should convert over to using the send plugin https://developers.facebook.com/docs/reference/plugins/send/
or the like plugin https://developers.facebook.com/docs/reference/plugins/like/
Make sure your Open Graph meta tags are in order (this is where you specify title) See https://developers.facebook.com/docs/opengraph/

Categories

Resources