Tagged: , ,

Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #15523

    Hi,

    Our site is in both English & Arabic language using WPML. All of the CSS seems to work fine for Arabic RTL but is there a way to resolve these remaining issues for the Arabic/RTL:

    1. In portfolios – how can we start items form the Right & not Left

    2. We are displaying the WPML language selector in the Main Menu which displays after the normal menus on the right for English/LTR thus becoming the last menu item but it also does the same for Arabic/RTL menu thus becoming the first menu item. Can the menu order be reversed for RTL so that the language selector as the last (right-most) menu item for RTL?

    Also, how can we change the Horizontal WPML language switcher that appears in the header on the top right with flags to show language names instead of flags?

    #87830

    Hi,

    Please:

    1) Add this code to Quick CSS in backend – Eunoia > Theme Options > Styling

    #js_sort_items{float: right}

    For your other questions, I must see the plugin inside Eunoia.

    Thanks,

    Nick

    #87831

    Hi,

    Thanks for your reply. That has made the sort menu right-aligned but the sort menu items are still LTR so ALL is on the left.

    But the actual portfolio items start from the left & so if we have less items than the available width e.g. 1 or 2 items – they are left aligned so this looks wrong with an RTL language. Any idea how to resolve that?

    Regarding the WPML problems that you need access to – I’m actually on local dev install but I’ll upload it tonight so that you can have a look.

    #87832

    Hi,

    Ok, I understand now. Mistake was mine for not thinking it through more. The solution is below, yet there are several other places throughout the theme where you will run into similar issues, though this is the most obvious case.

    Please open loop-portfolio.php which is in the includes folder of the theme *after* you backed up and saved the original file.

    Find a block of code approximately between lines 67-83:

    $output .= "<div class='sort_by_cat $hide '>";
    $output .= "<a href='#' data-filter='all_sort' class='all_sort_button active_sort'>".__('All','avia_framework')."</a>";
    foreach($categories as $category)
    {
    $output .= "<span class='text-sep ".$category->category_nicename."_sort_sep'>/</span>";
    $output .= "<a href='#' data-filter='".$category->category_nicename."_sort' ";
    $output .= "class='".$category->category_nicename."_sort_button' >".$category->cat_name."</a>";

    $container_id .= $category->term_id;
    }
    $output .= "</div>";
    $output .= "</div></div>";

    //fake pagesplit

    and replace it with the code below

    $output .= "<div class='sort_by_cat $hide '>";

    $categories = array_reverse($categories, true); //reverses categories for right-to-left languages
    foreach($categories as $category)
    {
    $output .= "<span class='text-sep ".$category->category_nicename."_sort_sep'>/</span>";
    $output .= "<a href='#' data-filter='".$category->category_nicename."_sort' ";
    $output .= "class='".$category->category_nicename."_sort_button' >".$category->cat_name."</a>";

    $container_id .= $category->term_id;
    }
    $output .= "<a href='#' data-filter='all_sort' class='all_sort_button active_sort'>".__('All','avia_framework')."</a>"; //All displayed last in right to left languages
    $output .= "</div>";
    $output .= "</div></div>";

    //fake pagesplit

    Please let us know how it went.

    Thanks,

    Nick

    #87833

    Hi Nick,

    I actually had just worked out a simple CSS solution for reversing the Portfolio Sort Menu order:

    #js_sort_items {
    float: right;
    padding-left:5px;
    padding-right: 0;
    }

    #js_sort_items a {
    float:right;
    margin-left:6px;
    margin-right: auto;
    }

    But unfortunately the more important solution for actually starting the PORTFOLIO ITEMS from the right for RTL still hasn’t been resolved – any ideas??

    Thanks

    #87834

    Hi,

    Unfortunately it’s not feasible for the support team to redo significant areas of the theme as a mirror image. Besides, there are even more areas where you will run into the same issues. Your best bet is to hire a freelancer to further customize your theme and truly make your site fully right-to-left compatible.

    Thanks,

    Nick

    #87835

    Hi,

    Take a look here, there are some examples of how to go about doing this:

    http://isotope.metafizzy.co/docs/help.html#righttoleft_layouts

    http://isotope.metafizzy.co/tests/right-to-left.html

    Good luck,

    NIck

    #87836

    Hi Nick,

    I’ve managed to RTL everything else required in the theme so far. I think the only thing remaining is to start the Portfolio Items from the Right.

    I’ll try & have a look – I presume it’s the avia.js that contains the Isotype javascript that needs to be changed as per the help link you sent me. The only thing is I haven’t got a clue how I can change it only for RTL & keep it the same for LTR.

    Thanks

    #87837

    Hi,

    Could you put up a demo with the plugin please? I was going to play around with it this weekend, but I forgot that you want two version to work depending on the plugin’s language selection.

    Logically something like this needs to happen:

    1) Page starts loading

    2) jQuery checks selector of plugin to see what language is shown

    3) conditionally LTR or RTL sections of code are executed

    or possibly can also use PHP to conditionally enqueue avis.js or avis-rtl.js based on metadata from the plugin. Since I don’t have it, I am not sure what method it uses to keep track of which language to display for visitors, cookies, meta data, etc…

    There are two or three locations where the categories are being displayed, did you change all of them?

    Thanks,

    Nick

    #87838

    Hi,

    Thanks for wanting to give it a go. I’ll put up a demo site within an hour (it’s local at present) – can you let me know how to send you the address & login details privately.

    #87839

    The demo site is up. Please email me @ rasheed_dot_laskar_at_gmail_dot_com & I’ll send you the address & WP credentials.

    Thanks

    #87840

    Email sent.

    #87841

    WP & FTP credentials sent.

    Thanks

    #87842

    Hi RSL,

    The topic is tagged for Nick’s personal Queue so he’ll be able to get back onto your issue shortly.

    Regards,

    Devin

    #87843

    I’m very interested in finding the solution for the RTL listing as we are using Arabic for our website. Please, and if possible, do share the finding with us :) thanks

    #87844

    Hi,

    Here is the page that gives the instructions for changing the portfolio code to RTL http://isotope.metafizzy.co/docs/help.html#righttoleft_layouts

    There is CSS above on this post, but your best bet is to contact RSL, his email is above since he worked it all out and is certain to help a fellow Arabic sites developer. But the code in this post will definitely get you going, and if you get stuck just post your url here and we will help you work it out.

    Thanks,

    Nick

Viewing 16 posts - 1 through 16 (of 16 total)

The topic ‘RTL Portfolio items & RTL Menu’ is closed to new replies.