Right-to-Left Languages (RTL)

5 0 7

hi all
I have created a store and I would like to publish it to people who speak Arabic
So I would like to change the right-to-left writing direction (RTL). I used some codes :


{%- if shop.locale == 'ar' -%}
<html class="no-js" lang="{{ request.locale.iso_code }}" dir="rtl">
{%- else -%}
<html class="no-js" lang="{{ request.locale.iso_code }}">
{%- endif -%}>


I changed the direction of writing but had some problems overlapping the text with the image  and no space between object
How can I solve this?




Screenshot_2020-05-12 HAS Market ~ Customize ~ Warehouse ~ Shopify.png





Replies 20 (20)
99 11 28

In Arab world, you have to use already RTL layout theme. if you don't have RTL coded theme you can't switch to RTL when translated. But you can't use paid RTL master app (paid)

1. use RTL theme like wookie, Ellla, etc

2. install Translating app eg. Etranslate (free) or Langify (paid)

3. inside app, you can translate and you can tick enable RTL.

4. After that check your website When you click it will automatically RTL When Arabic, LTR when English.

5. If not work then you had issue with Old theme, new theme no need to code, only old theme needed code, sometimes mobile doesn't responsive, so we need to use code for mobile also. every single theme needed different piece of code because same code doesn't work in all theme. you can search in theme editor or any RTL theme and search(TYPE) RTL, then you will find the RTL liquid file, we need to use same name in small piece of code in theme.liquid.  if mobile not work RTL then we need to use piece of code in mobile-nevigaton.liquid. there is quite small piece of work in every old theme.

6. If not RTL theme then we can do RTL but it will not responsive.


If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
Feel free to contact me on kuparkoti@gmail.com regarding any help
| Whatsapp: 00971568836211