Some Titles in Footer not aligned into right when user select Arabic language

Solved

Some Titles in Footer not aligned into right when user select Arabic language

Jo-Ibra
Tourist
8 0 1

Hello team,

 

I use trader theme,  I use 2 langauges ( Arabic and English ). In english version the footer is aligned correctly without any problem as you can see in the following picture:

JoIbra_0-1742075426587.png

BUT in Arabic version, the title of Email subscription not movie into right when user select Arabic language as illustrated in the below picture:

JoIbra_1-1742075888427.png

in addition, to adjust the spaces between policies links that marked by white square

 

Any suggestion it will be much appreciated.

 

Thank you

Jo-Ibra
Accepted Solution (1)

Yuparkoti
Shopify Partner
226 17 27

This is an accepted solution.

@Jo-Ibra 

You can try css tweaks,

I. CSS: fix title alignment (arabic RTL)

html[lang="ar"] .footer-subscription-title {
  direction: rtl;
  text-align: right;
}

replace .footer-subscription-title with actual class

II. adjust policy links spacing

html[lang="ar"] .policy-links {
  direction: rtl;
  display: flex;
  gap: 20px;
}

verify .policy-links via inspection

Steps: add this to your theme's custom CSS. like theme.css or rtl.css, ensure lang="ar" is applied in arabic mode. 

Hope this helps you. 

— Solve it? Hit Like and Accept Solution!
➡️Enjoy—Shopify 3 Day Free Trial | $1/Month for 3 Month
➡️Get Started—Shopify Point of Sale

View solution in original post

Replies 3 (3)

Yuparkoti
Shopify Partner
226 17 27

This is an accepted solution.

@Jo-Ibra 

You can try css tweaks,

I. CSS: fix title alignment (arabic RTL)

html[lang="ar"] .footer-subscription-title {
  direction: rtl;
  text-align: right;
}

replace .footer-subscription-title with actual class

II. adjust policy links spacing

html[lang="ar"] .policy-links {
  direction: rtl;
  display: flex;
  gap: 20px;
}

verify .policy-links via inspection

Steps: add this to your theme's custom CSS. like theme.css or rtl.css, ensure lang="ar" is applied in arabic mode. 

Hope this helps you. 

— Solve it? Hit Like and Accept Solution!
➡️Enjoy—Shopify 3 Day Free Trial | $1/Month for 3 Month
➡️Get Started—Shopify Point of Sale
Jo-Ibra
Tourist
8 0 1

Thank you for your replay, you are right,I agree with your solution, it is worked, However, after modified others CSS issues in RTL, The mobile version become as a miss. I reverted back to get the Arabic translation as Auto instead of change the whole theme into RTL. It is working as expected, finally, trader theme not fully supported RTL, It is need heavy styling customization for both Desktop and Mobile version, 

Jo-Ibra

devcoders
Shopify Partner
1326 157 378

Hello @Jo-Ibra 
Thank you for submitting your query to the Shopify community. I’d be happy to assist you. Could you please provide the store URL and password (if it’s password-protected) so I can review and get back to you with an update?

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!