Facebook-only login button in a wordpress page

Question

I need to insert in a page a Facebook only login button, without redirect (user after login remains on the same page) using one of this functions, creating a shortcode if it's possible. These function are from a plugin active on the site. The plugin manages all the wordpress login, but I need on a single page a Facebook only login.

add_action('userpro_inside_form_submit','userpro_social_connect');

function userpro_social_connect($array){

    global $userpro;



    // only in login/register

    if ($array['template'] == 'login' || $array['template'] == 'register' ) {



        echo '<div class="userpro-social-connect">';



        if (userpro_get_option('facebook_app_id') != '' && userpro_get_option('facebook_connect') == 1) {

            ?>



            <div id="fb-root" class="userpro-column"></div>

            <script>

            window.fbAsyncInit = function() {



                FB.init({

                    appId      : "<?php echo userpro_get_option('facebook_app_id'); ?>", // Set YOUR APP ID

                    status     : true, // check login status

                    cookie     : true, // enable cookies to allow the server to access the session

                    xfbml      : true  // parse XFBML

                });



                FB.Event.subscribe('auth.authResponseChange', function(response)

                {

                if (response.status === 'connected')

                {



                //SUCCESS



                }   

                else if (response.status === 'not_authorized')

                {



                //FAILED



                } else

                {



                //UNKNOWN ERROR



                }

                });



            };



            // Login user

            function Login(element){



                var form = jQuery(element).parents('.userpro').find('form');

                userpro_init_load( form );



                if ( element.data('redirect')) {

                    var redirect = element.data('redirect');

                } else {

                    var redirect = '';

                }



                FB.login(function(response) {

                    if (response.authResponse){



                        // post to wall

                        <?php if (userpro_get_option('facebook_autopost')) { ?>



                        <?php $scope = 'email,user_photos,publish_stream'; ?>



                        <?php if ( userpro_get_option('facebook_autopost_name') ) { ?>

                        var name = "<?php echo userpro_get_option('facebook_autopost_name'); ?>"; // post title

                        <?php } else { ?>

                        var name = '';

                        <?php } ?>



                        <?php if ( userpro_get_option('facebook_autopost_body') ) { ?>

                        var body = "<?php echo userpro_get_option('facebook_autopost_body'); ?>"; // post body

                        <?php } else { ?>

                        var body = '';

                        <?php } ?>



                        <?php if ( userpro_get_option('facebook_autopost_caption') ) { ?>

                        var caption = "<?php echo userpro_get_option('facebook_autopost_caption'); ?>"; // caption, url, etc.

                        <?php } else { ?>

                        var caption = '';

                        <?php } ?>



                        <?php if ( userpro_get_option('facebook_autopost_description') ) { ?>

                        var description = "<?php echo userpro_get_option('facebook_autopost_description'); ?>"; // full description

                        <?php } else { ?>

                        var description = '';

                        <?php } ?>



                        <?php if ( userpro_get_option('facebook_autopost_link') ) { ?>

                        var link = "<?php echo userpro_get_option('facebook_autopost_link'); ?>"; // link

                        <?php } else { ?>

                        var link = '';

                        <?php } ?>



                        FB.api('/me/feed', 'post', { message:body,caption:caption,link:link,name:name,description:description}, function (response) { });



                        <?php } else { $scope = 'email,user_photos'; } // end post to wall ?>



                        // get profile picture

                        FB.api('/me/picture?type=large', function(response) {

                            profilepicture = response.data.url;

                        });



                        // connect via facebook

                        FB.api('/me', function(response) {



                            jQuery.ajax({

                                url: userpro_ajax_url,

                                data: "action=userpro_fbconnect&id="+response.id+"&username="+response.username+"&first_name="+response.first_name+"&last_name="+response.last_name+"&gender="+response.gender+"&email="+response.email+"&name="+response.name+"&link="+response.link+"&profilepicture="+profilepicture+"&redirect="+redirect,

                                dataType: 'JSON',

                                type: 'POST',

                                success:function(data){



                                    userpro_end_load( form );



                                    /* custom message */

                                    if (data.custom_message){

                                    form.parents('.userpro').find('.userpro-body').prepend( data.custom_message );

                                    }



                                    /* redirect after form */

                                    if (data.redirect_uri){

                                        if (data.redirect_uri =='refresh') {

                                            document.location.href=jQuery(location).attr('href');

                                        } else {

                                            document.location.href=data.redirect_uri;

                                        }

                                    }



                                },

                                error: function(){

                                    alert('Something wrong happened.');

                                }

                            });



                        });



                    // cancelled

                    } else {

                        alert( 'Unauthorized or cancelled' );

                        userpro_end_load( form );

                    }

                },{scope: '<?php echo $scope; ?>'});



            }



            // Logout

            function Logout(){

                FB.logout(function(){document.location.reload();});

            }



            // Load the SDK asynchronously

            (function(d){

             var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];

             if (d.getElementById(id)) {return;}

             js = d.createElement('script'); js.id = id; js.async = true;

             js.src = "//connect.facebook.net/en_US/all.js";

             ref.parentNode.insertBefore(js, ref);

            }(document));



            </script>



            <a href="#" class="userpro-social-facebook userpro-tip" data-redirect="<?php echo $array['facebook_redirect']; ?>" title="<?php _e('Login with Facebook','userpro'); ?>"></a>



            <?php

        }

Answer 1

visit this link

https://developers.facebook.com/docs/plugins/login-button

click on get code button and follow the instructions. You have to specify the redirect url there and also, you need to create your app Id. The button will only work when you specify a hosted site url. And obviously it is not possible at the development level.

if the login button will not work. Then try for the like button code.

Or the third solution is, install the maxbutton plugin for wordpress, it will provide you the facility to create a button directing to facebook.com. Thank you