[xmas2]

hi

1) i have language switcher on top menu – it disappears in mobile view – any way to fix that easily? only social icons are visible there (by the way – is it possible to turn social icons on top menu? could find only how to do it for main menu and footer)….

2) in main menu when in mobile view – all language flags are not in a row but in a column – any way to have them in one row and have a bit more space between them?

 

[vako]

Hi @xmas2

 

At first, thank you for your response and for choosing our theme.

Can you please describe your issue more detailed? Can you please share the screenshot of the issue or a link where the issue exists?

 

Kind Regards

[xmas2]

here https://pulmakleit.com/et/meist/

on top left there is a language switcher. in mobile version it gets disappear for some reason. same goes when you resize Browser to a smaller window – language switcher disappears and social icons move from right corner to middle.

would like to have language switcher still visible…

tried with flags only, text only, flags and text – same story

[vako]

Hi @xmas2

 

1. if you want to display the top bar menu items on the mobile screenshot, please navigate to Dashboard > Appearance > Customize > Main Navigation and check the option “<b>Merge Top and Main Menus</b>“

2. On the mobile screens the language flags are displayed at the left corner if you want to make the align to the menu items, Please navigate to Dashboard > Appearance > Customize > Aditional CSS and following snippet:

.lang-item a img {
margin: 0 auto;
padding-bottom: 5px;
}

 

Kind Regards

 

[xmas2]

1) when i try to do that i get such error

2) this helps for mobile view. but then i have issue in normal view – flags are going up in a row and not aligned with other menu items 🙁

and is there any easy way to show those flags in a row in mobile view? instead of being one under another?

 

[xmas2]

that error is only when i add Language selection to upper menu.. if i remove it from there then error disappears

[vako]

Hi #xmas2

 

In order to assist you we need to check your site backend, please send us your website URL/USERNAME/PASSWORD.

Make sure to mark your reply as Private to hide it from the public.

 

Kind Regards

[xmas2]

i think i found root of the problem . seems it happens when i have language switcher on top and on main menu…

but anyway – this <span style=”color: #4f4f4f; font-family: Poppins, Helvetica, Arial, Verdana, sans-serif; font-size: 14px;”>Merge Top and Main Menus</span> – it only takes what you have on top menu and adds it to main menu while in mobile view… but what i want to achieve is to have language switcher visible on top menu while in mobile view…

but there it removes everything and leaves only social icons…. i would like to have only languages there on top while in mobile view…. or languages and social icons…

in main menu we do not need language options at all.. but now we have to keep those as it goes missing from top menu on mobile….

 

[vako]

Hi #xmas2

 

Unfortunately, it is not possible with the theme options, please try using some other 3rd party plugins to get the result.

 

Kind Regards

[xmas2]

hi

i found that now if to use

<span style=”color: #4f4f4f; font-family: Inconsolata, Consolas, Monaco, ‘Lucida Console’, monospace; font-size: 14px; white-space: pre;”>.lang-item a img { margin: 0 auto; padding-bottom: 5px;</span>

then it resizes flags…

to change space between flags in mobile view i had to change it to

.lang-item a img {

margin: 0 auto;

margin-top: 25px;

then on mobile it keeps flags sizes but changes distance between flags… which is great… but then i have small issue on computers – there are small dots between all menu items and flags.. and those dots between flags are going up and not in line with others 🙁 is there any other .lang-item needed to be added for those dots?

 

and new question – on mobile menu is collapsible… and when it is closed then we have symbol like arrow down – is it possible to add text there next to this “arrow”? like “open menu”

[vako]

Hi #xmas2

 

The only way is to remove them entirely because margin 0 auto code works for these flags too and these dots are aligned at the centre of the whole flag container, for the human eyes its looks like they are above.

Here is the CSS code to remove them:

#main-menu > li:after {
display: none;
}

 

Kind Regards

[Author]

Posts