Viewing 28 posts - 1 through 28 (of 28 total)
  • Author
    Posts
  • #778575

    Hi,
    Our website has two languages: English and Farsi (RTL language); we are using WPML for that.
    Now, in Farsi version, our widgets are not aligned in RTL, please let me know how.
    .

    Thanks,
    Sadegh

    #778593

    Hey Sadegh,

    Try to add this css in Quick CSS (located in Enfold > General Styling):

    #top.rtl #main .sidebar_left .sidebar {
        padding-top: 45px;
    }

    Just adjust the top padding as you see fit. Hope this helps :)

    Best regards,
    Nikko

    #778637

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

    #778886

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    .rtl .news-excerpt {
        padding-right: 50px;
    }
    

    Best regards,
    Yigit

    #779111

    Dear Yigit,

    Thanks but it didn’t help.

    #779133

    Hi,

    Please post us your login credentials (in the “private data” field), so we can take a look at your backend.

    Login credentials include:

    • The URL to the login screen.
    • A valid username (with full administration capabilities).
    • As well as a password for that username.
    • permission to deactivate plugins if necessary.

    Best regards,
    Nikko

    #779146

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

    #779317

    Hi,

    They show up fine on my end, attached a screenshot in private content field.

    Please flush browser cache and refresh your page a few times – http://wiki.scratch.mit.edu/wiki/Hard_Refresh

    Best regards,
    Yigit

    #779824

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

    .

    Thanks,
    Sadegh

    #779957

    Hi,

    Oh, sorry. Please add following code to Quick CSS as well :)

    .rtl .news-headline, .rtl .news-excerpt {
        text-align: right;
    }

    Best regards,
    Yigit

    #781893

    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.
    #781904

    Hi,

    You can set a exclusive body class for each language adding the follow custom code at your functions.php

    // Add specific CSS class by filter
      add_filter('body_class','my_class_names');
         function my_class_names($classes) {
           // add 'class-name' to the $classes array
           if(ICL_LANGUAGE_CODE == 'en'){
             $classes[] = 'class-name';
           }elseif(ICL_LANGUAGE_CODE == 'fr'){
            $classes[] = 'class-name';
    }
        // return the $classes array
        return $classes;
    }
    

    Just change the ‘en’ and the ‘fr’ by your languages and the ‘class-name’.

    Best regards,
    John Torvik

    #786245

    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?

    #786361

    Hi,

    Yes, you should add the code to functions.php file of your child theme in Appearance > Editor

    Let us say you named your classes as “class-name-en” and “class-name-fr”, then you can target each languages as following

    .class-name-en .main_menu { display: none; }
    .class-name-fr .main_menu { display: none; }

    If you have two languages and only one is RTL, then you can use following as well

    .rtl .main_menu { display: none; }

    Best regards,
    Yigit

    #787191

    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.
    #787204

    Hi,

    Your code should be as following

    .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, .rtl body .avia-font-entypo-fontello, html.rtl body [data-av_iconfont='entypo-fontello']:before { font-family: 'entypo-fontello'!important;}
    @media only screen and (max-width: 767px){
    .rtl #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;
    }
    }

    Best regards,
    Yigit

    • This reply was modified 7 years, 6 months ago by Yigit.
    #789089

    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 ?

    #789209

    Hi,

    How are you loading the “IRANSans” font?

    Best regards,
    Basilis

    #789332

    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');
    }
    #789466

    Hi Sadegh!

    I checked your website and it seems like you added @font-face in Style.css file of your child theme and it does work fine on RTL pages. Attached a screenshot in private content field. Have you figured it out already?

    Best regards,
    Yigit

    #789489

    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.

    #789554

    Hi,

    @font-face is not added on those codes. Therefore, it is normal. You can simply keep the @font-face in your custom CSS code and apply them only on certain RTL elements using the codes i posted above :)

    Best regards,
    Yigit

    #790291

    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.
    #790544

    Hi,

    Can you uplaod the font please to the main root, example:

    http://maga.co.ir/font/

    and try to link it from there after please?

    Thank you

    Best regards,
    Basilis

    #790868

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

    #791730

    Hi,

    I want to test if that is an issue with the ay u are embeding forms, if you can try it we can start locating the issue slowly./

    Best regards,
    Basilis

    #842889

    Hi,
    Thanks, the issue is already solved.

    (you may now close the thread please)
    Thanks
    Sadegh

    #842936

    Hi,

    Glad that it’s fixed. Thanks for using Enfold :)

    Best regards,
    Nikko

Viewing 28 posts - 1 through 28 (of 28 total)
  • The topic ‘Widgets are not RTL’ is closed to new replies.