Facebook login like Pinterest style -


i want integrate pinterest style facebook login website. there way this?

pinterest facebook login style

i have solution, it's not optimal. found pinterest uses endpoint generate it's nice button: facebook.com/v2.7/plugins/login_button.php ; however, generated output seems tied pinterest facebook application id (i tried inputting id received standard login button per facebook documentation here).

so hacky solution presented comes combining scottyg's answer this question iframe taken pinterest site 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>     <a href="#" style="position:absolute; top:0; left:0; display:inline-block; width: 268px; height: 50px; z-index:5;"></a> </div>

where here can replace anchor's href whichever url need if building server-side oauth dance planning (alternatively register facebook javascript api's fb.login() call onclick here).

here's example: https://jsfiddle.net/rw9f7jxj/

note: didn't test browsers worked me in both safari , chrome.


Comments

Post a Comment

Popular posts from this blog

php - How to add and update images or image url in Volusion using Volusion API -

actually have store importing products store product data insert , update image or image url not insert , update. this xml code name datapro.txt. <products_joined> <productcode>3710_012t</productcode> <vendor_partno>eah5450silent/di/1gd3(lp)</vendor_partno> <productname>test product ta</productname> <hideproduct>n</hideproduct> <stockstatus>20</stockstatus> <lastmodified>1/5/2016 10:25:00 am</lastmodified> <lastmodby>2</lastmodby> <productweight>0.9</productweight> <productprice>100</productprice> <productmanufacturer>asus tek</productmanufacturer> <vendor_price>32.69</vendor_price> <numproductssharingstock>0</numproductssharingstock> <categoryids>107</categoryids> <producturl>http://tebkq.mvlce.servertrust.com/productdetails.asp?productcode=3710_012t</producturl>
Read more

javascript - IE9 error '$'is not defined -

Image
<!--[if lte ie 9]><html class="lte9"><![endif]--><!--[if gt ie 9]><html><![endif]--> <!--[if !ie]><!--> <html> <!--<![endif]--> blah blah <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="{{ asset('js/mypage.js') }}" type="text/javascript"></script> </body> </html> when load page, ie9 brings error '$' not defined . how can solve error? +++ mypage.js $(function(){ //when load page, //ie9 tag not moving. $(window).load(function() { $('div.mask').hide(); }); // when click , willshow show. //for not ie 9 if (!$('html').hasclass('lte9')) { var = $('ul.about > li > span.activebtn');
Read more