New Landing How can we help? Themeforest Theme Support Flexform WPML-language switcher in main-navigation

Viewing 15 posts - 1 through 15 (of 18 total)
  • Posted in: Flexform
  • #188180
    glutzkommunikation
    Member
    Post count: 46

    Hello Support-Team

    I have a problem with the wpml-language switcher.

    I’ve created a horizontal language-switcher in the WP-Mainmenu. Now I’m trying to move these switcher to the right side. That means the main-navigation should stay on the left side and the language-switcher should move to the right side (see attached screenshoot).

    I have tried a lot of custom css – in the Flexform Theme Options as well as in the wpml settings – unfortunately without success. Has anybody an idea?

    Thank you very much for your help and kind regards.
    Achim

    Attachments:
    You must be logged in to view attached files.
    #188343
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,

    Please use this custom css code:-

    li.menu-item-language{float:right !important;}

    Thanks 🙂
    With Best Regards
    Mohammad

    #188387
    glutzkommunikation
    Member
    Post count: 46

    Hi Mohammad

    Thank you very much for your answer. I’ve use the css code and now the language switcher is on the right side. There are two things which I want to change:

    1. Now the active Language moves to the right side.
    Can we create a css-code or change on of the flex form php-files that the order of the language-list always stay the same? (DE  EN  ES  PT)

    (In the wpml configuration I have choose, that the active language is colored green.
    It seems, that flexform ignore the wpml configs.)

    2. As you can see on the attached screenshoot, the navigation isn’t flush with the image (on the left side and on the right side, too). Is it possible to change that?

    Thank you very much, Mohammad and have a nice day.
    Achim

    Attachments:
    You must be logged in to view attached files.
    #188449
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,

    Please remove last css code:-

    li.menu-item-language:first-child{margin-left:46% !important;}

    li.menu-item-language-current > a{color:#317930 !important}

    Thanks 🙂
    With Best Regards
    Mohammad

     

    #188538
    glutzkommunikation
    Member
    Post count: 46

    Hey Mohammad

    Thank you for the codes. I have try your custom css an with the following versions, it works :-)

    /* Full width menu code */
    #nav-section{
    width: 98%!important;
    }

    li.menu-item-language-current > a{
    color:#317930 !important
    }

    li.menu-item-language{
    float:right !important;
    }

    Do you think we’ll solve the problem, that the arrangement of the languages will always be the same, no matter which one is choosen (DE EN ES PT)? At the moment every time you chose a language, the chosen one moves to the right.

    If you can do this last thing for me, you make my day!

     

    Kind regards
    Achim

    Attachments:
    You must be logged in to view attached files.
    #188541
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,

    Please remove this code:-

    li.menu-item-language{
    float:right !important;
    }

    -Mohammad

    #188555
    glutzkommunikation
    Member
    Post count: 46

    Hey Mohammad

    Sorry, but if I remove this one, the language-switcher tuns back to left behind the main-navigation.

    Is there a bug in one of my other custom css-codes?

    #header-section{
    padding: 0 0 !important;
    border: none;
    }

    /* Full width logo code */
    #header-section #logo{
    width: 100%;
    float: center;
    }

    #header-section #logo img, #header-section #logo img.retina{
    margin: 0 auto;
    float: center;
    width: 200px; /*adjust as necessary*/;
    }

    /* Full width menu code */
    #nav-section{
    width: 98%!important;
    }

    li.menu-item-language{
    float:right !important;
    }

    li.menu-item-language-current > a{
    color:#317930 !important
    }

    nav .menu ul li{
    font-size:14px;
    font-family: Source Sans Pro;
    font-weight: 400;
    }

    nav .menu ul{
    background: rgba(255, 255, 255, 0.8);
    border:0px;
    -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26ffffff,endColorstr=#26ffffff);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26ffffff,endColorstr=#26ffffff);
    zoom: 1;
    }

    #main-navigation{
    float: none;
    width: 100%;
    height: 48px;
    text-align: left;
    }

    nav .menu li{
    float: none;
    }

    .nav-wrap{
    float: none!important;
    }

    /* Responsive code */
    @media only screen and (max-width: 767px) {
    #header-section #logo img, #header-section #logo img.retina {
    margin-bottom: 20px;
    }

    @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,800,300,700);

     

    Thank you
    Achim

    #188586
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,

    You forgot to insert this custom css code:-

    li.menu-item-language:first-child{margin-left:46% !important;}

    -Mohammad

    #188629
    glutzkommunikation
    Member
    Post count: 46

    Hello again, Mohammad

    I’ve put the code in but nothing change.
    So I think, that do not solve the problem.
    Any other Ideas?

    Thank you for your patience!

    #188717
    Nishant – SUPPORT
    Spectator
    Post count: 649

    Try to clear your browser cache and check again.

    #188870
    glutzkommunikation
    Member
    Post count: 46

    Good Morning, Mohammad,
    Hello Support-Team

    I have cleared the browser cache but nothing change. (www.aguaverde.ch/wordpress)
    If you chose one language, the position always change to the right side.
    <span id=”result_box” class=”short_text” lang=”en”><span class=”hps”>Desired</span> <span class=”hps”>situation: the order of the languages are fixed (DE  EN  ES  PT).</span></span>

    Following the compled custom-css-codes:

    #header-section{
    padding: 0 0 !important;
    border: none;
    }

    /* Full width logo code */
    #header-section #logo{
    width: 100%;
    float: center;
    }

    #header-section #logo img, #header-section #logo img.retina{
    margin: 0 auto;
    float: center;
    width: 200px; /*adjust as necessary*/;
    }

    /* Full width menu code */
    #nav-section{
    width: 98%!important;
    }

    li.menu-item-language{
    float:right !important;
    }

    li.menu-item-language:first-child{
    margin-left:46% !important;
    }

    li.menu-item-language-current > a{
    color:#317930 !important
    }

    nav .menu ul li{
    font-size:14px;
    font-family: Source Sans Pro;
    font-weight: 400;
    }

    nav .menu ul{
    background: rgba(255, 255, 255, 0.8);
    border:0px;
    -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26ffffff,endColorstr=#26ffffff);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#26ffffff,endColorstr=#26ffffff);
    zoom: 1;
    }

    #main-navigation{
    float: none;
    width: 100%;
    height: 48px;
    text-align: left;
    }

    nav .menu li{
    float: none;
    }

    .nav-wrap{
    float: none!important;
    }

    /* Responsive code */
    @media only screen and (max-width: 767px) {
    #header-section #logo img, #header-section #logo img.retina {
    margin-bottom: 20px;
    }

    @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,800,300,700);

     

    Thanx
    Achim

    #188885
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,

    Please check it now.

    -Mohammad

    #188904
    glutzkommunikation
    Member
    Post count: 46

    …. Sorry, but they are still moving…  🙁
    I’ve cleared all the browser caches (safari, firefox, chome).
    The result is always the same.
    Sorry for that…

    #188994
    Mohammad – SUPPORT
    Moderator
    Post count: 27441

    Hi,

    I cant believe. Please check my screenshot.

    -Mohammad

    Attachments:
    You must be logged in to view attached files.
    #189037
    glutzkommunikation
    Member
    Post count: 46

    Hi Mohammad

    I’m afraid that was a misunderstanding….?!
    The position from the language switcher is ok (look at my screenshots).
    But if you chose one language, the the order of languages is changing.
    Situation at the moment, if you are choose…

    German        =     <span style=”color: #339966;”>DE</span>  EN  ES  PT
    English          =     <span style=”color: #339966;”>EN   <span style=”color: #000000;”>DE  ES  PT
    Spanish         =     <span style=”color: #339966;”>ES</span>  DE  ES  PT
    Portuguese   =     <span style=”color: #339966;”>PT</span>  ES  EN  DE</span></span>
    I would prefer:

    German         =       <span style=”color: #339966;”>DE</span>  EN  ES  PT
    English          =        DE  <span style=”color: #339966;”>EN</span>  ES  PT
    Spanish         =        DE  EN  <span style=”color: #339966;”>ES</span>  PT
    Portuguese   =        DE  EN  ES  <span style=”color: #339966;”>PT</span>

     

    Kindest regards
    Achim

    Attachments:
    You must be logged in to view attached files.
Viewing 15 posts - 1 through 15 (of 18 total)

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register