Return to previous page

Changing social login buttons look - by tuijatuulia

This topic has 9 replies, 3 voices, and was last updated 4 years, 6 months ago ago by tuijatuulia

tuijatuulia

Participant

October 25, 2020 at 12:29

Hi, I have working social login buttons for Facebook and Google. I would like to change them to look similar in both Mobile and Desktop.

Now desktop has buttons like this: https://prnt.sc/v6e80d and Mobile has buttons like this: https://prnt.sc/v6e8n7

I would like them to have buttons that have same size (width and height) as normal login button, and placed below normal login button, one button per row, and the look would be close to this https://prnt.sc/v6e7b1

How to do this? Can you help me please, I would prefer to have the icon on my site locally, and just refer to it. I don’t see where the current pictures come from, but could I just add a picture with similar name to same folder on my server?

#256456 Copied Theme version: 7.0.2 WooCommerce version: 4.6.1

8 Answers

Rose Tyler

Support staff

October 25, 2020 at 15:04

Hello,

In the next theme update, we will add Facebook and Google login like here – https://xstore.8theme.com/
Maybe it would be better not to customize the styling of an additional plugin, but disable this plugin and use our functionality after the update.

Regards

#256466 Copied

tuijatuulia

Participant

October 25, 2020 at 17:05

Oh, that is very good news! I will definitely use your new look, would not like to add any plugin for this reason.
May I suggest you use the look from official guideline: (dark option) https://developers.google.com/identity/branding-guidelines
and for facebook: https://developers.facebook.com/docs/facebook-login/web/login-button/ (Plugin configurator in the middle of the page creates the button image in different sizes)

Do you have some estimate for next theme update?

#256472 Copied

Olga Barlow

Participant

October 26, 2020 at 18:39

Hello,

Thank you for your suggestions. We plan to release new update within 2 days.

Regards

#256578 Copied

tuijatuulia

Participant

November 16, 2020 at 21:14

Hi – I have installed update but how to change the button look?

#259909 Copied

Olga Barlow

Participant

November 17, 2020 at 15:38

Hello,

I don’t see that you use our built-in option. You use the third-party plugin.
We added button styles according to the FB and Google requirements http://prntscr.com/vktha4 . How would you like to change the styles of these buttons?

Regards

#260022 Copied

tuijatuulia

Participant

November 18, 2020 at 00:44

Hi, to my understanding I don’t use a third-party plugin. I have only settings for Google and FB API from Dokan to handle login requests, and those brought the social buttons to my theme. I was earlier trying with FontAwesome, but that did not work out and I took it away – and would prefer of course XStore buttons, to minimize plugin amount.

My buttons still look is similar to earlier in XStore, like this https://prnt.sc/vl3nwr

I would really like those buttons that you linked – those are exactly the way I was hoping to achieve in 3 places:

1. On this Sign-in pop-up (picture above)

2. On login page
https://test.villeriina.net/sisaankirjautuminen/ (same in English:
https://test.villeriina.net/en/log-in/ )

3. On the login/register page that appears when you go to “My account” before logging in:
https://test.villeriina.net/oma-tili/ (same in English:
https://test.villeriina.net/en/my-account/ )

Can you please help me to use the built-in option? I don’t find it.

#260118 Copied

Olga Barlow

Participant

November 18, 2020 at 17:28

Hello,

Go to XStore > Authorization APIs > http://prntscr.com/vlluq6
Watch the video tutorials https://youtu.be/mBp33hPMgnA and https://youtu.be/eDclashcCwo

Regards

#260233 Copied

tuijatuulia

Participant

November 20, 2020 at 01:23

Thank you for the instructions. Now I got it working again. First I thought // was a spelling mistake but learned soon it was not 🙂

#260441 Copied
Viewing 9 results - 1 through 9 (of 9 total)