Right-to-left checkout: what Arabic shoppers notice

Updated · 6 min read · Trifid Media LLC

On an Arabic checkout the layout flips: text starts on the right, and fields and buttons line up from the right. Numbers don't flip. Prices, phone numbers, order numbers and English words such as brand names still read left to right inside the Arabic text. When punctuation lands on the wrong side, an English label is left behind, or Arabic words appear in a different font from the rest of the page, the checkout looks unfinished to an Arabic reader. Check all of this on a real phone before you publish Arabic.

What does Shopify say about right-to-left?

Shopify's help says the latest versions of its Horizon family of themes support right-to-left languages such as Arabic, Hebrew and Urdu. If you use another theme, Shopify says to confirm that it supports right-to-left languages so the layout is correct.

On October 2, 2026, Shopify announced improved support for Arabic, Urdu and Hebrew in the admin and in storefronts, including checkout, customer accounts and the Horizon themes. The same post says your own content, such as product pages, stays in the languages you have added, and that you add the translations, for example with the Translate & Adapt app.

Shopify's help also lists 33 languages with ready-made checkout translations, and Arabic isn't on that list (checked 26 October 2026). So read every label on your Arabic checkout yourself. For how to fill the gaps, see how to offer an Arabic checkout on Shopify.

Why do numbers and punctuation jump around?

A page that mixes right-to-left Arabic with left-to-right numbers or English is called bidirectional (or "bidi") text. Browsers lay it out with the Unicode Bidirectional Algorithm, and the W3C explains the parts that matter on a checkout:

  • Numbers run left to right, but they don't break up the Arabic around them. A currency symbol next to a number is treated as part of the number.
  • Punctuation has no direction of its own. A comma, full stop, bracket or space between Arabic and English takes the direction of the surrounding paragraph. That is why a full stop after an English word at the end of an Arabic sentence can show up on an unexpected side, and why brackets around English text, as in «الدفع عند الاستلام (COD)», are worth checking.
  • Some phrases need help from the theme. The W3C lists phone numbers, street and email addresses and brand names among the phrases that run in the opposite direction to the text around them. In theme code, a developer can mark them with the dir attribute or the bdi element so they display correctly.

In text you type into Shopify yourself, such as checkout labels, shipping rate names and payment method names, you usually can't add that markup. Keep these lines simple:

  • Avoid ending an Arabic sentence with an English word followed by punctuation.
  • Leave out English abbreviations in brackets. «الدفع عند الاستلام» is clearer than «الدفع عند الاستلام (COD)». See what to call Cash on Delivery in Arabic.
  • If you add an example phone number to a field label, look at it on the Arabic checkout before you publish.

Which digits will shoppers see and type?

Arabic text can use two families of digits: European digits (0123) and Arabic-Indic digits (٠١٢٣). The W3C's Arabic layout requirements list Arabic-Indic digits for eastern Arabic-speaking countries, naming Egypt, Saudi Arabia and Iraq as examples. The same document notes that signs such as plus and minus, or a currency symbol, are likely to be treated as part of a number rather than as punctuation, and uses phone numbers as an example.

What this means for your checkout:

  • Look at which digits your Arabic checkout shows for prices and totals, and use the same style in the text you write yourself, such as shipping rate names and your order confirmation message.
  • A shopper typing on an Arabic phone keyboard may enter a phone number in Arabic-Indic digits. Try it at checkout, place the order, and see how the number appears on the order in your admin. Your courier needs a number it can dial.

Do your fonts have Arabic letters?

A font that has no Arabic letters can't draw Arabic. The browser then uses a fallback font for those words, so an Arabic label can look different from the English brand name next to it.

Start with your theme fonts. Shopify's developer documentation lists the character ranges included in its font library files: Basic Latin, Latin-1 Supplement, Latin Extended-A and currency symbols. Arabic isn't among them. For a broader range of characters, Shopify points to system fonts, Typekit and other solutions. Open your Arabic pages with the font you chose and check that the Arabic text looks the way you expect.

For the checkout, go to Settings > Checkout. In the Configurations section, click Edit next to your checkout configuration, and use the Headings and Body drop-down menus in the Typography section to pick fonts from the list. After any change, open the checkout in Arabic again.

Also look at lines that mix both scripts, such as an Arabic label next to your brand name. The W3C's Arabic layout requirements list the relative size of Arabic and Latin letters in mixed text as one of the things to consider when choosing a font.

Which labels are easy to leave in English?

When you check an Arabic checkout, these are easy to miss, because the text comes from your own settings or an app, or only appears when something goes wrong:

  • shipping rate names and delivery times;
  • payment method names, including cash on delivery;
  • error messages;
  • text added by checkout apps;
  • the order status page and the order confirmation email.

For the cash on delivery name, a single manual payment method has one name for every shopper. Khaleeji COD can show «الدفع عند الاستلام» on the Arabic checkout and "Cash on Delivery" everywhere else.

How do you test an Arabic checkout?

  1. Switch your store to Arabic (for example yourstore.com/ar) on a phone, add a product whose name includes English letters, and go to checkout. Repeat on a computer.
  2. Check that the form, the order summary and the buttons line up from the right, and that arrows such as "back" point the right way.
  3. Type an address that mixes Arabic and English, for example an English building name in an Arabic address. Type a phone number with the country code, once in European digits and once in Arabic-Indic digits.
  4. Submit the form with a required field empty, and read the error messages.
  5. At the payment step, read every payment method name and check the totals, including how the currency and digits appear.
  6. Place a test order. Read the thank-you page and the Arabic order confirmation email, and look at how the address and phone number appear in your admin and on the shipping label.
  7. Ask a native Arabic reader to go through the same steps.

To test payment options for a particular customer, use how to test checkout payment rules with draft orders.

Sources

  1. Shopify Help Center: Requirements and considerations for selling in multiple languages
  2. Shopify Changelog: Admin now supports 3 new languages (October 2, 2026)
  3. Shopify Help Center: Customizing the style of your checkout
  4. Shopify.dev: Font settings and the Shopify font library
  5. W3C: Unicode Bidirectional Algorithm basics
  6. W3C: Inline markup and bidirectional text in HTML
  7. W3C: Arabic & Persian Layout Requirements (Group Draft Note, October 2025)

Checked on the date above. Shopify and courier settings change, so check the source if something looks different.

Stop paying shipping twice for refused orders

Khaleeji COD has been submitted to the Shopify App Store and is in review. Email us and we'll tell you the day it's live.

In review for the Shopify App Store · Email: