Global expansion, localizing content, and selling in multiple currencies and languages
Hello, We wanted to make our website bilingual so we used an add on to translate our website from English to Arabic but the Arabic appears from left to right it's supposed to be right to left. We tried a code but it made both languages from right to left. We need help where the Arabic ONLY is right to left.
Hello @PlanteriorShop
To make the Arabic text on your website right to left, you can use the following CSS code:
.rtl { direction: rtl; }
This code will set the direction of all text with the class .rtl to right to left. You can then add this class to the div element that contains the Arabic text.
For example, if the Arabic text is in the following div element:
<div class="arabic-text">This is some Arabic text.</div>
You would then add the following CSS code to your website:
.arabic-text { direction: rtl; }
This would make the Arabic text in the div element right to left.
If you are using a translation add-on, you may need to add the .rtl class to the div element manually. The add-on may not automatically add this class to the div element if the text is in Arabic.
Once you have added the .rtl class to the div element, the Arabic text should appear right to left.
Hello @PlanteriorShop ,
Here's a general guide you can follow:
Go to Online Store -> Themes -> Actions -> Edit code
Go to Assets folder -> base.css file or theme.css file
Add this following code at the bottom of page
.arabic-text {
direction: rtl;
unicode-bidi: embed;
}
Save and preview
Hope this can help.
Transcy
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025