Hi guys

Recently we started migrating our age old corporate website (Joomla based) to WordPress and one of the major challenges we faced was including “Arabic” text with certain pages. First of all, our theme didn’t come with a RTL option, plus, We didn’t need the entire site to be RIGHT to LEFT. Instead, just a portion of chosen pages displaying relevant Arabic text.

Here I am sharing a hack that helped us to address this requirement. As I mentioned, all we needed were few chosen blocks (Text boxes) displaying Arabic text in proper formatting, after few hours googling I landed on this page https://codex.wordpress.org/Right_to_Left_Language_Support which explains how to make a RTL CSS files from existing style.css from the theme that is used, to cater the RIGHT to LEFT requirements and making own rtl.css file following the instructions provided. As all I needed was to changed the properties of few text boxes, I continued searching and landed on this YouTube video

This video explains how to add custom CSS with different elements of Elementor editor & that was what I was looking for! I gave a try like following, chose a column which was having the text box, Advanced & under Custom CSS added the below code portion. That was it!

selector{
direction: rtl;
unicode-bidi: embed;
}

So if you ever come across such a requirement, know how to handle it without breaking your head & changing the current Theme with a RTL supported theme, which I know, will be a nightmare!

Hope this helps few WordPress enthusiasts out there!

regards,