handling LTR and RTL for Arabic Sites (internationalization)

0 Views

I am creating a site in WordPress,It is basically an english site but when user clicks on translate it translate it into Arabic.There is problem of ltr and rtl,How can I solve that.I am using qtranslate plugin right now.Same is the case with urdu ,kurdish languages.
Anyone who can help me with this
please see attached imageenter image description here
Thanks

Post Views: 0

Related posts

Leave a Reply

2 comments

  1. It seems this wordpress plugin is inserting a language direction and name into the <html> tag. like this:

    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">

    OR

    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ar-AR">

    If I understand you the plugin is not rendering correct direction attribute for the ltr languages.

    First Option

    One option is to use javascript to fix this. simply we detect the rtl languages by their ISO codes (here it’s ar for Arabic) and adding a class to the body tag

    jQuery(function(){

    jQuery("html[lang=ar]").attr("dir", "rtl")
            .find("body").addClass("right-to-left");

});

    Now you can style that elements in the theme css file by prefixing that right-to-left class like this: (this is just a sample)

    body.right-to-left my-element li {
    float:right;
    direction: rtl;
}

    .

    Second Option

    As suggested by the other answer Use php to insert that class name into the body tag of the page. open your header.php file in your theme and edit this line:

    <body class=" <?php if($_GET["lang"] == "ar") echo "right-to-left"; ?> ">

    Now use the same css to style you elements

  2. One simple but inefficient way is to check the language with PHP in your theme’s header file and if it’s Arabic or another RTL language you can add the dir=”rtl” to your HTML or any tag you want. I realized that qTranslate has a GET method mode and adds something like ?lang=ar to the URLs. So you could easily check it with PHP: if ($_GET["lang"]=='ar') ...

    EDIT

    You can add something like this in your theme’s header file. (You can find this file from path_to_wordpress/wp-content/themes/your_theme/header.php), It’s either called header.php or something similar.

    find the <body> tag and add this line to the end (before the > sign):

    <?php if($_GET["lang"] == "ar") echo "dir='rtl'"; ?>