This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

This thread is resolved. Here is a description of the problem and solution.

Problem:
WooCommerce Social Login buttons RTL alignments

Solution:
It really depends on how the plugin created for RTL.
Anyhow, add this code WPML > Language > Language Switcher options > additional CSS

.rtl .button-social-login, .rtl .widget-area .widget a.button-social-login, .rtl a.button-social-login, .rtl button.button-social-login, .rtl input.button-social-login { padding: 0 0 0 10px !important; }
.rtl .button-social-login .si, .rtl .widget-area .widget a.button-social-login .si, .rtl a.button-social-login .si, .rtl button.button-social-login .si, .rtl input.button-social-login .si { margin-right: 0 !important; margin-left: 10px; }

This fixed the issue.

This topic contains 2 replies, has 2 voices.

Last updated by arnoldS-2 1 month ago.

Assigned support staff: Riffaz.

Author Posts
September 15, 2019 at 1:48 pm #4574769

arnoldS-2

I am trying to:

Display the login buttons correctly for Hebrew here;

hidden link

Widget Footer 3

and

hidden link

Login page Hebrew

The gab as shown with red arrow needs to appear on the left side of the logos.

September 15, 2019 at 2:55 pm #4574871

Riffaz
Supporter

Languages: English (English )

Timezone: Asia/Colombo (GMT+05:30)

Hi,

Thank you for contacting WPML support.

It really depends on how the plugin created for RTL.
Anyhow, add this code WPML > Language > Language Switcher options > additional CSS

.rtl .button-social-login, .rtl .widget-area .widget a.button-social-login, .rtl a.button-social-login, .rtl button.button-social-login, .rtl input.button-social-login { padding: 0 0 0 10px !important; }
.rtl .button-social-login .si, .rtl .widget-area .widget a.button-social-login .si, .rtl a.button-social-login .si, .rtl button.button-social-login .si, .rtl input.button-social-login .si { margin-right: 0 !important; margin-left: 10px; }

This should fix your issue.

Let me know how it goes.

Regards,
Riffaz.

September 15, 2019 at 4:03 pm #4575025

arnoldS-2

My issue is resolved now. Thank you!