How to Make Your Campaigns Appear Right to Left (RTL)

If you use a language that requires RTL (right-to-left) display, follow this guide to allow your campaigns to display the text RTL.

IMPORTANT: This guide assumes you’re already familiar with our Custom CSS tool.

We’ll be using CSS to modify the display of text in our campaign. For more information on this concept in general, check out W3school’s guide.

  1. Add Custom CSS to the Campaign
  2. Modify Remaining Elements as Needed (optional)

Step 1 – Add Custom CSS to Your Campaign

Select the campaign you want to edit to open the Campaign Builder, then navigate to the Display Settings Panel and scroll down to the Custom CSS field.

Custom CSS

You can then copy and paste the following CSS into the Custom CSS field for your campaign.

html div#om-{{id}} * {
    direction: rtl !important;
}

RTL CSS

Your campaign should now appear RTL.

Step 2 – Modify Remaining Elements as Needed (optional)

Once you’ve applied the CSS for RTL, you may wish to change the alignment of your text areas as well.

You can select any text area, and using the text editor change the alignment of the text.

Change Text Direction

That’s all, you’ve successfully converted your campaign to be easily written with Right-To-Left text!
NOTE: If your campaigns are written in a non-English language you should also review our documentation to create custom input field error messages.