Mobile site not showing submenu like Desktop

[willplei]

Hi,

I have a WP site using X and Connerstone. I want to make my site multilingual so I used a plugin called “WPGlobus”. I tried many other plugins and I think this one works best. I am able to translate Connerstone content using the “Text” view in the Wordpress editor, which is great. The language switcher works perfectly in the top menu. (Many other plugins don’t). The only problem I have now is with the mobile site. The menu on the mobile site only shows “Chinese Traditional” for the language switcher (I have Chinese Traditional and English for my site, default is Chinese Traditional). I tried the default WP theme and the language switcher on mobile works well. So I would like to ask is there any solution to this?

Thanks,
Will

[friech]

Hi Will,

Thank you for writing in, please add this to Theme Options > CSS

@media (max-width: 979px) {
	#x-nav-wrap-mobile .menu_item_wpglobus_menu_switch ul.x-collapsed {
		display: block;
	}
}

This should display the other language on your mobile, unfortunately, though we can’t make it a dropdown like on the desktop.

Hope it helps,
Cheers!

[willplei]

@friech

@media (max-width: 979px) {
#x-nav-wrap-mobile .menu_item_wpglobus_menu_switch ul.x-collapsed {
display: block;
}
}

Thank you @friech
This makes me thinking is it possible to create a dropdown menu for language switcher completely using CSS code. I tried creating a menu (custom link) but failed. The language switcher is done by enabling the option in WPGlobus plugin options.

Thank again for the help!

Will

[jade]

Hi Will,

You might need more than CSS to be able to add a language switcher on the site as CSS could only add some styling.

Cheers!

[willplei]

I just experimented it a little and found a super easy workaround for this.
I set the display of language switcher in menu to “NONE” in WPGlobus plugin. Then add a menu item with WP custom link. I created an item called “Language” and add “Chinese Traditional” and “English” as submenu, with a custom link to “/” and “/en”. To my surprise, it works well. Because it is WP built in functionality, it works perfectly on both desktop and mobile

Now, I may just find out how to add a little icon on the menu items to make it beautiful. I think CSS can do it.
Because I am not technical, would you be so kind to suggest the code here?

Thanks a million!!

Will

[rad]

Hi Will,

You mean the flag icon? You can add <img src="http://example.com/flag.jpg"> to the menu label with the URL of the flag image. It easier than CSS since the flag icons are not part of the theme.

Thanks!