I want to integrate Pinterest style Facebook login to my website. Is there a way to do this?
pinterest facebook login style
I have a solution, but it's certainly not optimal. I found that Pinterest uses this endpoint to generate it's nice button: facebook.com/v2.7/plugins/login_button.php ; however, the generated output seems to be tied into the Pinterest Facebook application ID only (I tried inputting my ID but only received a standard login button as per Facebook documentation here).
So my hacky solution presented comes from combining ScottyG's answer from this question with the iframe taken from the Pinterest site to get the following:
<div style="position:relative;">
<iframe name="f34219de7beb196" width="268px" height="50px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:login_button Facebook Social Plugin" src="https://www.facebook.com/v2.7/plugins/login_button.php?app_id=274266067164&channel=https%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter%2Fr%2FiPrOY23SGAp.js%3Fversion%3D42%23cb%3Df5f46a0766a3f%26domain%3Dau.pinterest.com%26origin%3Dhttps%253A%252F%252Fau.pinterest.com%252Ff16edab41b7ba12%26relation%3Dparent.parent&container_width=268&locale=en_US&scope=public_profile%2Cemail%2Cuser_likes%2Cuser_about_me%2Cuser_birthday%2Cuser_friends&sdk=joey" class="" style="border: none; visibility: visible; width: 268px; height: 50px;"></iframe>
</div>
Where here you can replace the anchor's href to whichever url you need if you are building a server-side Oauth dance like I am planning to do (alternatively you could register the Facebook javascript api's FB.login() call to the onclick here).
Here's an example: https://jsfiddle.net/rw9f7jxj/
Note: I didn't test all browsers but it worked for me in both Safari and Chrome.
I couldn't figure out what the links mean in the answer above, so I assume that Facebook removed these pages already. Just in case anybody else ends up here, there's a section for creating a login button with "Continue as {NAME}" option on Facebook: https://developers.facebook.com/docs/facebook-login/web/login-button
Related
I have created a project in which I provided a login system. I also want to provide a login with the google option. I have installed Django-allath and made the necessary changes to log in and retrieve the necessary data. But when I click on login with google it sends me to the simple login page and after continuing it redirects me to the google login page. I want when I click on login with google, the application should send me to the google login page.
Please help me.
<a href="{% provider_login_url 'google' %}">
<img src="https://img.icons8.com/color/480/000000/google-logo.png" />
</a>
not sure what your problem is but use django social auth.
The docs are straight forward. you van use it in combination with all auth
docs
I'm using the nice django-social-auth in one of my projects.
Basically I would like to be able to login without leaving the current page (whithout even refreshing it).
I thought about simply using target="_blank" in my provider links
<a href="{% url socialauth_begin service %}"
rel="nofollow" target="_blank">{{ service|title }}</a>
But of course it is redirecting to the default location after the successful login.
Is there a way to automatically close this new window on success so the user gets the previous page ?
With some JS and some parameters for the backend, you could open a popup window where the user can do the auth (some backends accept parameters that generate a different auth dialog layout). In that popup the user will proceed with the auth process and the popup could be closed with some JS too when the user is redirected back to the final URL.
Some of the services support javascript based login, which might be what your are looking for, however it depends on which services you want to use and whether they do support this. For example there is Client-side JavaScript SDK on Facebook.
My Facebook Like button does not work for those not logged into Facebook. They press the "Like" button and the login window appears for Facebook. When they enter their information and submit, an HTTP 500 error pops up. I followed the Facebook developer code to put the "Like" button on the page. Any ideas?
http://www.thebleepkidssay.com
This maight be facebook app restriction issue. Try to set peoples age who can see your app, from 18 to 13 8for example
There are a few things you could try - first of all your code is kind of mess. There are two <html> (and there should only be one) tags opened and only one gets closed for example. Also, your using
<fb:like href="http://www.thebleepkidssay.com" send="true" layout="button_count" width="300" show_faces="false"></fb:like>
to call your button. You might try
<div class="fb-like" data-href="http://www.thebleepkidssay.com" data-send="true" data-width="300" data-show-faces="false"></div>
instead (this is the format that is generated if you use http://developers.facebook.com/docs/reference/plugins/like/ to get your button).
I have page which has the url like the following.
http://example.com/?f=chatter
It has three links.
When I click on a link it details page is display. Which has the url like
http://example.com/?f=chatter&aid=6
But this url does not appear in the browser address bar. It displays in a textbox on its details page. The url in address bar remains the same http://example.com/?f=chatter
My page is of .tpl
Now I want to add the facebook like button to the details page which will share the link of that details page which is displaying in the textbox.
But when I click on the facebook like button, it share the link which is in the address bar of the browser.
{$url} this contains the details page url which is displaying in the textbox.
I have used the following code of the facebook like button.
<iframe src="//www.facebook.com/plugins/like.php?href={$url};send=false&layout=standard&width=450&show_faces=false&action=like&colorscheme=light&font&height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>
Where in href I have place the {$url}.
I don't know if this will be useful to you but I'm using a jquery plugin that is unfortunatly not free ($5) called jQuery Social Share Buttons plugin
Although I'm having problems getting the facebook like button to include a popup which allows posting the url to my feed (keep getting 'Unknown RPC service: widget-interactive' error when trying to implement), I was able to get the twitter button to post the url.
I have added the following to my Blogger template to add a Like button on each of my Blogger post:
<script>
document.write('<iframe src="http://www.facebook.com/plugins/like.php?href=<data:post.url/>&layout=standard&show_faces=false&width=380&action=like&font=trebuchet+ms&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:25px"></iframe>');
</script>
My question is, how could I know who exactly has pressed Like as it only display the number of people who have liked my post?
Thank you!
Facebook doesn't provide an API to get a list of people who like a page. This is probably due to privacy issues (although with Facebook you never know their reasonings, they sell your personal information all the time).
My question is, how could I know who exactly has pressed Like as it
only display the number of people who have liked my post?
Force users to log into your website and only then display the like button for them. When you hear the edge.create event fire then log the user who is logged in.