Widgets are not RTL

Hi
I used the code and it doesn’t work for me

Dear Yigit,

Thanks but it didn’t help.

Hi Nikko,
Please find the login credentials in private box.

Dear Yigit,
Thanks but I wanted them to be “aligned right” (they are now aligned left)

Thanks,
Sadegh

Hi dear Yigit,
Thanks a lot for the code, it’s solved the issue.
/
However, a question is still exist for me. We are using WPML plugin so our website has two languages. Then at the back-end, we can choose “Enfold Child Option” for any of our two languages, Farsi or English.
Each one of these languages, has its custom codes in General Styling tab. The question is, is there any way we could combine all these codes together in style.css child but still avoid the conflicts between two languages?

Regards,
Sadegh

• This reply was modified 7 years, 7 months ago by Sadegh.

Hi John,
Thanks for the details. So I have to add these codes to my child theme function.php, right?
> But after that, how can I assign class-name to each languages in style.css?

Thanks a lot dear Yigit for the detail.
Yes, we have an English version and Farsi (RTL language) version.

For instance, right now we have these codes under our general tab:

body { font-family: "IRANSans" !important; }
fieldset label { font-family: "IRANSans" !important;}
input[type="submit"], h1, h4, h5, h3, h2 { font-family: "IRANSans" !important;}
input[type='text'],
input[type='email'],
textarea{ font-family: 'IRANSans' !important;}
#top .avia-font-entypo-fontello, body .avia-font-entypo-fontello, html body [data-av_iconfont='entypo-fontello']:before { font-family: 'entypo-fontello'!important;}

@media only screen and (max-width: 767px){
#header_meta .sub_menu {
    min-width: 560px;
    background: rgba(0, 0, 0, 0);
    padding-left: 0;
    padding-top: 0px;
    right: 30%;
    position: relative !important;
    top: 15px;
}
}

So, should I add them into the style.css with the below changes:

.rtl body { font-family: "IRANSans" !important; }
.rtl fieldset label { font-family: "IRANSans" !important;}
.rtl input[type="submit"], h1, h4, h5, h3, h2 { font-family: "IRANSans" !important;}
.rtl input[type='text'],
.rtl input[type='email'],
.rtl textarea{ font-family: 'IRANSans' !important;}
.rtl #top .avia-font-entypo-fontello, body .avia-font-entypo-fontello, html body [data-av_iconfont='entypo-fontello']:before { font-family: 'entypo-fontello'!important;}
.rtl @media only screen and (max-width: 767px){
#header_meta .sub_menu {
    min-width: 560px;
    background: rgba(0, 0, 0, 0);
    padding-left: 0;
    padding-top: 0px;
    right: 30%;
    position: relative !important;
    top: 15px;
}
}

• This reply was modified 7 years, 6 months ago by Sadegh.

Hi dear Yigit,

Thanks, I’ve done that but our custom font-face font didn’t show up after that in our RTL page
Is there anything I didn’t take care of ?

Hi Basilis,
We are using font-face command as below:

@font-face {
font-family: 'IRANSans';
src: url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.eot');
src: url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.eot?#iefix') format('embedded-opentype'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.woff2') format('woff2'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.woff') format('woff'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.ttf') format('truetype'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.svg#IRANSans') format('svg');
}

Hi dear Yigit,
> Actually I have changed all the codes back to prevent the RTL pages from that issue.
I had added your given codes (From This Post), but after that, our RTL pages couldn’t load the custom font.

Hi Yigit,
So you mean I should use the font-face code as below?

@font-face {
.rtl font-family: 'IRANSans';
src: url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.eot');
src: url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.eot?#iefix') format('embedded-opentype'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.woff2') format('woff2'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.woff') format('woff'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.ttf') format('truetype'),
url('http://maga.co.ir/wp-content/themes/enfold-child/fonts/IRANSansweb.svg#IRANSans') format('svg');
}

I think it relates to these below codes:

.rtl body { font-family: "IRANSans" !important; }
.rtl fieldset label { font-family: "IRANSans" !important;}
.rtl input[type="submit"], h1, h4, h5, h3, h2 { font-family: "IRANSans" !important;}

I have put them on the style.css but the problem was still exist.

• This reply was modified 7 years, 6 months ago by Sadegh.

Hey Basilis,
Isn’t there any other way rather than uploading font to the main root?

Hi,
Thanks, the issue is already solved.

(you may now close the thread please)
Thanks
Sadegh