How can I align text to the right in my Arabic online store?

Hi,

I’m working on my store and I cannot align the text to the right since that my store is in Arabic.

Preferably, all the texts on my store should be aligned on the right side.

Does anyone have an experience with this issue?

FYI, I’m using Refresh Theme.

Thank you in advance :smiling_face:

Hello @Alfarsi .,
Please share your website URL.

Hi @Alfarsi you will need an RTL app to convert your site to Arabic text. or you can use the text-align property for every section and text. you can start here by doing so section by section.

Hello @Alfarsi

Please could you share your store URL so that I can review it?

Hello Ahsan,

How can I use the text align property for every section?

Many thanks in advance

PLease share the store URL so i can give code for that.

matilalight.com/

Hi @Alfarsi
You can try this code

  1. Go to Online Store-> Theme->Edit code
  2. Asset-> base.css ->paste the below code at the bottom of the file.
.title {
    text-align-last: right !important;
}
.card__information > * {
    text-align: right;
}

It didn’t work out

The text has changed to the right :+1:t2: thanks but the theme still from left to right. For example, Menue botton, product description head.

Hello @Alfarsi

Which one would you like to change? Please share a screenshot.

For example, the titles in the attached screenshot and the menue button in the header attached also.

Hello @Alfarsi ,

Go to online store >> edit code >> open “theme.liquid” file
In body tag add attribute dir=“rtl”

Like this - <body class=“gradient” dir=“rtl”>

Thank you

@Alfarsi
Hello,

@media screen and (max-width: 749px){
.header.header--top-center {
	direction: rtl;
}}

Add this CSS at the bottom of Online Store-> Theme->Edit code->Assets->base.scss.liquid

Like This

It worked perfectly.

Thank you so much

Hi I tried the same

However it still has not changed for me. could you please explain how exactly and where would this be posted under base.scss.liquid