Return to previous page

Menu Language Query - by zf - on WordPress WooCommerce support

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

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.

#88303 Copied

10 Answers
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.
#88345 Copied
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

#88588 Copied

zf

Participant

September 23, 2015 at 08:41

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

Thank You

#88749 Copied

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.

#89474 Copied

zf

Participant

September 28, 2015 at 12:42

Still waiting, another 5 hours later?

#89642 Copied

zf

Participant

September 29, 2015 at 08:17

IT IS NOW 6 DAYS LATER?????

#90057 Copied
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.
#90189 Copied
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

#90356 Copied

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.

#90620 Copied
Eva Kemp

Participant

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.
#90657 Copied
Viewing 11 results - 1 through 11 (of 11 total)