Changing text direction to "right to left"

Changing text direction from “left to right” to “right to left” for website translation in to Arabic

Recently, we provided Arabic translation for one of our hospitality clients in Bangkok. This was a wordpress based website and for such websites we use WPML plug-in and link it to our CAT tool. After the translation is completed and reviewed in the CAT tool, we sync the translation to the website, and then we carry out an on-web review of the translation.

Once we started the on-web review, we discovered 2 problems:

Someone from the client’s end had used Automatic translation for some parts of the website.
The Arabic translators felt, although our translation were displaying accurately, that the text direction needs to be changed from the usual “left to right” for English to “right to left” for Arabic readers.

Let’s discuss the second problem first as this is the main topic of this blog, and we hope the solution we found can also help you with your project.

Obviously, if you are a web developer, you know there are ways of creating a “right to left” template for the Arabic version of the website. However, this involves quite a lot of work and we also did not want to client to have to pay additional amounts for this. After doing some research and a few hours or test and trial, we found that the easiest way was to change the direction of only the text – one paragraph at a time. We did this by adding the following code to the text editor (not the visual editor) – this can be done in WordPress’ own page editor and in Elementor as well, simply by adding the following code before the paragraph you would to change from “left to right” to “right to left”: <p dir=”rtl”> …text… and ending the paragraph with </p>. You will have to do this for each paragraph and each element, however, once you get used to it, it doesn’t take too long.

For example:

Normal left to right text: This is a sentence.

Text with the above code to change the direction to “right to left” in Arabic:

هذه جملة.

If we post the same Arabic text without the said code, it will look like this:

هذه جملة.

You will notice that the period is at the right end here, and that is incorrect.

We ended up adding this code to each paragraph – some parts were a little tricky as you have to find where to edit the text, however, our web-support team and the client’s web-support them managed to figure these out.

If you are experiencing the same problem, we hope this helps you with it.

Now back to the first problem we encountered;

In-order to remove the automatic translation and make sure that WPML doesn’t keep using it again and again, we decided to remove all current translations in WPML, delete the language files from the website database, and reset WPML and disable automatic translation engines and put 0 as the automatic translation credit.

After this we added the pages, posts, and strings back to the translation basket, sent to our CAT tool, pull the translation from the TM (as we had already completed all translation previously), and sync back to the website.

We did all this before applying the code to change the text direction to “right to left”.

After applying the code, we did another on-web review, and the website is ready for client review.

We hope this post helped!

If you are looking to translate your website in to any language, please contact us for a quote and to discuss the process. We provide a complete service from assessing the amount of text on the your website, translating all relevant content, to fully applying the translation to your website. Our regular website translation clients translate their websites to: Arabic, Chinese, French, German, Japanese, Korean, Russian, and Thai.

or at: pm@moduslanguageservices.com

Changing text direction to “right to left”

Related Posts