Social Login Pro for WooCommerce

[Adam]

How to show social login (https://woocommerce.com/products/social-login-pro-for-woocommerce/) in popup? We have social login pro plugin from woocommerce. We want to use this plugin's shortcode ([woo_slp_login]) in popup login. currently we have FB, twt, Linkedin, apple from your plugin. we don't want them from your vibebp, we want to use our own plugin. I tried this code but no effects:

add_action('bp_after_sidebar_login_form','show_social_login');
function show_social_login() {
    echo do_shortcode('[woo_slp_login]');
}

I just want to know where exactly I can add that shortcode so when I click login/register button in menu, in popup it will show our social media login instead of yours. https://www.hublearn.com/

[Veronica]

try to add this

add_filter('vibebp_vars',function($data){
    $data['translations']['login_heading'] .= do_shortcode([yourshortcodehere]);
});

[Adam]

yes but adding that codedoes not show the button login/register button where I need to click. go to our site: https://www.hublearn.com/ and see after Langage menu, no more login/register button And then I see following errro:

TypeError: window.vibebp.settings is undefined
    he https://www.hublearn.com/wp-content/plugins/vibebp/assets/js/login.js?ver=1.5.8.1:1
    we https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:84
    zj https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:226
    Th https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:152
    tj https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:152
    Te https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:146
    Ja https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:224
    md https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:173
    nd https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:175
    Rh https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:147
    nd https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:175
    render https://www.hublearn.com/wp-includes/js/dist/vendor/react-dom.min.js?ver=16.13.1:238
    <anonymous> https://www.hublearn.com/wp-content/plugins/vibebp/assets/js/login.js?ver=1.5.8.1:1
    <anonymous> https://www.hublearn.com/wp-content/plugins/vibebp/assets/js/login.js?ver=1.5.8.1:1
    EventListener.handleEvent* https://www.hublearn.com/wp-content/plugins/vibebp/assets/js/login.js?ver=1.5.8.1:1
    n https://www.hublearn.com/wp-content/plugins/vibebp/assets/js/login.js?ver=1.5.8.1:1
    <anonymous> https://www.hublearn.com/wp-content/plugins/vibebp/assets/js/login.js?ver=1.5.8.1:1
    <anonymous> https://www.hublearn.com/wp-content/plugins/vibebp/assets/js/login.js?ver=1.5.8.1:1

[Adam]

Now i tried this way:

add_action('bp_after_sidebar_login_form','show_social_login');
function show_social_login() {
    add_filter('vibebp_vars',function($data){
        $data['translations']['login_heading'] .= do_shortcode([woo_slp_login]);
    });
}

But still shows vibebp social login but not ours from our shortcode: woo_slp_login

[Anshuman Sahu]

Sorry we forgto to add this line in the code : 'return $data;'

add_filter('vibebp_vars',function($data){
    $data['translations']['login_heading'] .= do_shortcode([yourshortcodehere]);
return $data;
});

[Adam]

Thanks, Yes, it shows but some of them social media not working. But if we go a page where we already have this plugin's shortcode was used then the popup social media works, but where there is no shortcode then it does not work. for example this page: https://www.hublearn.com/login-to-hublearn check both popup social media and the page's social media, both works. But in home or other pages, then popup social media does not work. It missing something js files it seems.

[Adam]

now i added the shortcode in footer which means it running the code everywhere but I hide it and now the popup social media login works. But this is not the right way to do. So your code blocked the essential js files to load. How to solve it ?

[Anshuman Sahu]

Well yes as our component dynamically adds the login popup to the HTML dom and dynamically removed on clicking on login link and close icon . the buttons depending upon javascript events might not work . What you can do is to hide our login from there in header and add your login link in menu and put a link to your login page there having these social logins and . Im sorry the compatibility for that plugins is not available right now . We have our own social logins : https://www.youtube.com/watch?v=0h3oECa2JMg&vl=en

[Adam]

okay i see. I already unchecked your social login from vibebp->settings. I only kept phone authentication and email login option. Currently our social login is working as I used this login's own shortcode in footer and made it invisible. What you said (..add your login link in menu and put a link to your login page there having these social logins..) its already implemented here: https://www.hublearn.com/login-to-hublearn/. But we like the popup option too. So we are keeping both options. Anyways you can close the ticket.

[Author]

Posts