This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

This topic contains 3 replies, has 3 voices.

Last updated by Itamar 1 year ago.

Assigned support staff: Itamar.

Author Posts
September 7, 2018 at 12:31 pm #2714592

ondrejK-3

I am trying to: have normal menu with WPML

Link to a page where the issue can be seen: hidden link

I expected to see: correct css of menu as in English or German.

Instead, I got: Broken language switcher with search and button

September 10, 2018 at 1:56 pm #2720111

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi,

Thank you for contacting WPML Support. You can fix this issue by adding following CSS in your theme’s or child theme style.css file OR Custom CSS section of the theme:

#site-navigation > div[class^="menu-menu"] {
    display: inline-block;
}

And it will look as in attached screenshot.

Thank you

September 19, 2018 at 9:06 pm #2750047

ondrejK-3

Hi Noman, Thank you for your message. I added following CSS in my theme and the code work well. Thank You. But when I clicked on search (on czech or german version), the menu has moved below the search. Can you resolve this problem please? Thank you for Your help.

September 20, 2018 at 12:38 pm #2752092

Itamar
Supporter

Languages: English (English ) Hebrew (עברית )

Timezone: Asia/Jerusalem (GMT+03:00)

Hi there.

Noman is not available today, so I'll continue to handle this ticket. I hope that it is alright with you.

The issue now is not directly with CSS but with JS. When pressing the search icon, the menu is disappearing by a JS click command which is coming from a JS file in your theme here.
/wp-content/themes/refur-child/js/script.js?ver=0.9.29
The command is adding the following CSS to the 'menu-menu-1-container' class of the menu.

display: none;

Please see the attached screenshot menu-menu-1.jpg.
This is not happening in the second language because WPML is replacing the menu's container div class to 'menu-menu-cz-container'. So this change needs to be done in the JS file. The code that is creating this command is the following code which is starting in line 250.

		$(document).on('click', '.main-navigation #search-launcher-desktop', function(e) {
			e.preventDefault();
			$('#search-panel').css('width', $('#site-navigation').width());
			$('#search-panel').show();
			$('.menu-menu-1-container').hide();
			$('.top_extra').addClass('noextra');
			$('#search-launcher-desktop').hide()
		});
		$(document).on('click', '#search-panel .search-panel-close-icon', function(e) {
			e.preventDefault();
			$('#search-panel').hide();
			$('.menu-menu-1-container').show();
			$('.top_extra').removeClass('noextra');
			$('#search-launcher-desktop').show()
		});

Maybe you could ask the help of the support team of your theme to add the needed code to this JS file. The same command would need to be applied for the 'menu-menu-cz-container' class.

Please let me know if this information is helpful to you.

Regards,
Itamar.

The topic ‘[Closed] Czech is not working in menu switch correctly’ is closed to new replies.