Does Weglot support Right To Left (RTL) languages?

In this article, you will find how Weglot supports Right To Left (RTL) languages translations.

Weglot supports RTL languages and keeps the same layout and HTML structure as the original version of your website in the translated versions. Here are some of our available RTL languages:

  • Arabic (ar), 
  • Hebrew (he), 
  • Persian (fa) 
  • or Urdu (ur) 

How to customize your RTL languages layout?


1) On WordPress:

You can add some custom CSS code which can be applied only to your RTL languages. To do so, you'll need to go to your WordPress Admin > Weglot > Language button design, in the 'Override CSS' field. For instance, you could change the size and font of your website for the Arabic language:

2) On Shopify: 

You can go to your Shopify Dashboard > Apps > Weglot > Custom CSS and add some custom CSS rules to change the layout of your RTL languages. 

Here is an example of CSS rules: 

html[lang="ar"] body {
    font-family: fantasy!important;   
    font-size: 12px!important; 
}
This above rule, for instance, will be applied only to the Arabic version and will change its font family to fantasy and its font size to 12 pixels

Layout issues that might happen

Sometimes, your pages might not be fully properly displayed in RTL design.

To fix that:
- First, check with your inspector if the CSS rule direction: rtl; applies to the concerned content. If not, please add it to your Weglot Override CSS
- Alternatively, you could also try other CSS rules such as:

  • float: right!important; align-content: right!important; 
  • or align-items: right!important;

Still need help? Contact Us Contact Us