Main issue: Align all text and layout to the right for an Arabic Shopify store using the Refresh theme (RTL support).
What was tried: Initial CSS targeting text alignment was added to base.css (e.g., right-aligning titles and product card info). This partially worked—text aligned right—but the overall layout remained left-to-right (e.g., Menu button, product description headings). Screenshots were provided to illustrate these elements.
Key solution: Switch the document direction to right-to-left (RTL) by adding dir=“rtl” to the tag in theme.liquid. Additionally, set the header to RTL on mobile with a media query in the theme’s base stylesheet (e.g., adding .header.header–top-center { direction: rtl; } under max-width: 749px).
Notes on terms: RTL means right-to-left layout. The HTML dir attribute sets the page’s reading and layout direction. The CSS direction property controls layout flow of elements.
Outcome: These changes resolved the issue for the original poster.
Open item: Another user reported the CSS change didn’t take effect and asked where exactly in base.scss.liquid to place it; further guidance is pending.
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 
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.
Hi @Alfarsi
You can try this code
.title {
text-align-last: right !important;
}
.card__information > * {
text-align: right;
}
It didn’t work out
The text has changed to the right 
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
