Menu Language Query - by zf - on WordPress WooCommerce support

This topic has 11 replies, 3 voices, and was last updated 8 years, 6 months ago ago by Eva Kemp

  • Avatar: zf
    zf
    Participant
    September 21, 2015 at 13:16

    Hi Guys,

    I require some assistance with the ffg: I need to move the selector in the menu to between the menu and search icon. Also how would I adjust it differently on tablet and mobile as it blocks out the search icon in its current position when viewed on a device.

    Please see attached and private section for link.

    http://prntscr.com/8isc1n

    Thank You Kindly

    Please, contact administrator
    for this information.
    10 Answers
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    September 21, 2015 at 16:04

    Hello,

    Please add this code in Theme Options > Custom CSS > Custom CSS for desktop:

    .languages-area {
        float: left;
        margin-right: 150px !important;
    }

    and use this code in Custom CSS for mobile:

    .languages-area {
       margin-top: 30px !important;
    }

    Best regards,
    Jack Richardson.

    Avatar: zf
    zf
    Participant
    September 22, 2015 at 12:39

    Hi Jack,

    I tried the code but it did not suit my needs due to changes that were made to menu. I used the code below though:

    .languages-area {
    float: right;
    height: 1px !important;
    position:relative;
    top:30px;right:0px;
    padding: 7px 0px !important;
    margin-right: 35px !important;

    }

    The Desktop version works perfectly however when it scales down to 1024×768 it does not display correctly http://prntscr.com/8j5w9c

    Coincidentally it looks the same on iPad and Android tablet. If possible could it move up above the search icon

    With the mobile would it be possible to move the switcher into the mobile menu?

    Thank You

    Regards

    Zunaid

    Avatar: zf
    zf
    Participant
    September 23, 2015 at 08:41

    Good Day, please may I have a response to this.

    Thank You

    Avatar: zf
    zf
    Participant
    September 28, 2015 at 06:52

    Hi, it has been 5 days since i submitted my reply and I still have not had any feedback.
    Please advise urgently.

    Avatar: zf
    zf
    Participant
    September 28, 2015 at 12:42

    Still waiting, another 5 hours later?

    Avatar: zf
    zf
    Participant
    September 29, 2015 at 08:17

    IT IS NOW 6 DAYS LATER?????

    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    September 29, 2015 at 12:58

    Hello,

    We are sorry for a long delay.

    Please add this code in Custom CSS for desktop:

    .navbar-collapse {
        padding-left: 0px;
    }
    .header-logo {
        max-width: 240px !important;
    }

    Unfortunately switcher can’t be moved to mobile menu.

    Best regards,
    Jack Richardson.

    Avatar: zf
    zf
    Participant
    September 30, 2015 at 07:20

    Hi, no problem. The above solution didnt seem to work.
    What I have done however is use different css for each device i.e Desktop, Tablet and Mobile

    What happens though is that between the ffg sizes +-1200 to +-964px the menu gets cut off. Please advise as to what selector i can use to fix the language selector for above sizes.

    Desktop:

    .languages-area {
    float: right;
    height: 1px !important;
    position:relative;
    top:30px;right:0px;
    padding: 7px 0px !important;
    margin-right: 35px !important;

    }

    Tablet:

    }

    .languages-area {
    float: right;
    height: 1px !important;
    position:relative;
    top:0px;right:-20px;
    padding: 7px 0px !important;
    margin-right: 35px !important;

    }

    Mobile Landscape:

    }

    .languages-area {
    float: right;
    height: 1px !important;
    position:relative;
    top:0px;right:-20px;
    padding: 7px 0px !important;
    margin-right: 35px !important;

    }

    Mobile Portrait:

    }

    .languages-area {
    float: left;
    height: 1px !important;
    position:relative;
    top:0px;left:130px;
    padding: 10px 0px !important;

    }

    http://quirktools.com/screenfly/ – I use that to test sizes.

    Thanks

    Avatar: zf
    zf
    Participant
    October 1, 2015 at 07:28

    Hi, so i have managed to fix all my issues. Just one remains…please assist

    When viewing site on iPad or any device at the 768×1024 resolution (Portrait on tablets) the language selector moves to the left. I used the code below to fix the issue on 1024 x 768 where it cuts off the menu.

    Please view link in private content

    @media only screen and (max-width: 1199px){
    .languages-area {
    float: right;
    height: 5px !important;
    position:relative;
    top:0px;right:-25px;
    padding: 7px 0px !important;
    margin-right: 35px !important;

    }

    Thank You

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    October 1, 2015 at 09:31

    Hello,

    Please try to use this code in custom.css:

    @media only screen and (max-width: 992px) { .languages-area {
        float: right;
        margin-bottom: -50px;
    }}

    Regards,
    Eva Kemp.

  • Viewing 11 results - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.