Shopify Supporting Right-to-Left Languages (RTL)

New Member
1 0 0

I have just started using Shopify on a Hebrew store website.

 

There any way to support to RTL for the Hebrew language?

 

0 Likes
Shopify Staff
Shopify Staff
516 0 40

Hey there, 

I'm Ann, from the team here at Shopify :)

That can be customized into your store's theme, but it does take a bit of coding in order to make it happen. To get to that section of your theme, from your Shopify admin, click on Online Store>Themes>Actions>Edit Code. Once there, follow these steps: 

  1. From the menu you'll see on the left, open theme.liquid
  2. Near the top of the file, usually in the first 2-5 lines, you'll see text like this
     <html class="no-js" lang="{{ shop.locale }}">
    The code will vary with different themes, just make sure it's the tag that starts with <html 
  3. Before the closing > just add a space followed by the text dir="rtl" to tell the browser to flip everything. This will re-arrange elements like the logo and how text inputs work too. The end result will look like
    <html class="no-js" lang="{{ shop.locale }}" dir="rtl">

     

  4. Then just hit Save

It's worth noting some themes are designed so that cart and search icons may not move automatically. If it's a theme created by Shopify you can reach out to us directly and we'll look into fixing it for you. If your theme is created by a third party company, reach out to your theme's developers and they can help!

Finally, to change the checkout to right to left, the language should be set to a right to left language like Hebrew - In the admin, go to Online Store>Themes>Actions>Edit Languages and click to Change theme language. Then just remember to hit Save as well! 

I hope this helps! If you have any more questions or concerns feel free to reach out to us here :) 

Have a great one,
Ann

Ann | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
New Member
1 0 0

I don't seem to be able to align the text (in pages editor) to RTL.

the editor offers an option to align text RTL but it doesn't really work...

Ant advice? I just want this one page aling RTL so editing the theme is not an option. 

0 Likes
Shopify Partner
3 0 0

that is right.

but  slide show go hidden and not see it or photo at home page

 

help us

0 Likes
Shopify Partner
5 0 0

Hi 

I'm using venture theme . for a Hebrew store.

i have installed the code as described .the site  alignment  has changed the menu bar is RTL as i wanted . but suddenly the slides doesn't show the images 

just black background .

{when i returned to  the original code without the RTL -the slides work fine- meanthis is the issue} can you assist to solve that ?

Regards 

David

0 Likes
New Member
10 0 0

Go to theme.liquid and place the below code above the <head>

 

<!doctype html>
<!--[if IE 9]> <html class="ie9 no-js" lang="{{ shop.locale }}"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class="no-js" lang="{{ shop.locale }}" dir="rtl"> <!--<![endif]-->

 

And save

 

Praveen - Shopify expert

0 Likes
Shopify Partner
5 0 0

Thank you

Should i place  this code with the RTL Code ?{listed at Ann reply}


@Praveennair wrote:

Go to theme.liquid and place the below code above the <head>

 

<!doctype html>
<!--[if IE 9]> <html class="ie9 no-js" lang="{{ shop.locale }}"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class="no-js" lang="{{ shop.locale }}" dir="rtl"> <!--<![endif]-->

 

And save

 

Praveen - Shopify expert


 

0 Likes
Shopify Partner
5 0 0

I have tried it with and without the RTL code .the text and menu change to RTL  but still ,the slide show  images doesn't show
@avidshopperguid wrote:

Thank you

Should i place  this code with the RTL Code ?{listed at Ann reply}


@Praveennair wrote:

Go to theme.liquid and place the below code above the <head>

 

<!doctype html>
<!--[if IE 9]> <html class="ie9 no-js" lang="{{ shop.locale }}"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html class="no-js" lang="{{ shop.locale }}" dir="rtl"> <!--<![endif]-->

 

And save

 

Praveen - Shopify expert


 




0 Likes
New Member
10 0 0

Just place this code that's it 

0 Likes
Shopify Partner
5 0 0

Thank you 

I placed  the code only.  unfortunately the slides disappeared again {all the rest is fine} 


@Praveennair wrote:

Just place this code that's it 


 

0 Likes