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 here.

  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 Optin Panel and scroll down to the Custom CSS field.

Custom CSS Field

You can then copy and paste the following example CSS into the Custom CSS field for your campaign. Be sure to update the CSS to use your own campaign’s unique slug.

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

Custom CSS RTL Style

Your campaign should now appear RTL.

Optin RTL Direction

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 direct select any text area, and using the text edit toolbar change the alignment of the text.

RTL Text Formatting Right Align

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.