Skip to content Skip to sidebar

Home › Support › English Support › [Resolved] The language switcher not return when mouse away in Mobile View

[Resolved] The language switcher not return when mouse away in Mobile View

This thread is resolved. Here is a description of the problem and solution.

Problem:
1. The client needed assistance with the WPML language switcher not retracting when the mouse moved away and had added custom code to remove the background and border.
2. The client wanted to replace the language switcher widget with a global icon that would display a dropdown list of languages on mouseover.

Solution:
1. We recommended creating a custom language switcher by following the instructions in our documentation: Adding Language Switchers using PHP and Shortcodes. Within the customization options, the client should select the "Dropdown Click" feature to enable the language switcher to open and close with a tap on mobile devices.

2. We provided a sandbox site for the client to examine the settings: Example on sandbox site and the link to access it: Access sandbox site.

If the solution provided does not apply to your case, or if it seems outdated, we encourage you to open a new support ticket. We also highly recommend checking related known issues at WPML Known Issues, verifying the version of the permanent fix, and confirming that you have installed the latest versions of themes and plugins. For further assistance, please visit our support forum.

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.

Tagged: 

This topic contains 3 replies, has 2 voices.

Last updated by Kor 1 year, 10 months ago.

Assisted by: Kor.

Author Posts
May 7, 2024 at 6:16 am #15599902

kevinT-10

Hi Supoprt Team,
I have 2 question on this website. hidden link

1.
May I know why the wpml switcher unable to return back when mouse move away, please check the video attached.

I have added the custom code as below (remove background and border).

.elementor-39 .elementor-element.elementor-element-2bb8c6a .wpml-elementor-ls .wpml-ls-item .wpml-ls-link, .elementor-39 .elementor-element.elementor-element-2bb8c6a .wpml-elementor-ls .wpml-ls-legacy-dropdown a {

background-color: #004898;
}

.wpml-ls-legacy-dropdown a {
border: 0px solid #cdcdcd;
}

.wpml-ls-legacy-dropdown .wpml-ls-sub-menu a {
border-width: 0px;
}

.wpml-ls-legacy-dropdown .wpml-ls-sub-menu {
border-top: 0px solid #cdcdcd;
}

2. And
Is it possible to make a Global Icon replaced to this switcher widget, and ;
when moseover the Global Icon, the language dropdown list to be showed 3 language options.
Due to there is to show the current language on first.

Thank you
May 8, 2024 at 7:26 am #15604593

Kor

Hello,

Thank you for reaching out. I'll do my best to address your inquiries accordingly.

1. Could you please share the video in question again? Perhaps you could upload it to Google Drive or Dropbox.

2. Regrettably, there isn't an option available to accomplish this task. It would require custom programming work, which falls outside the scope of our support. In this case, I recommend considering reaching out to one of our certified partners listed at this link: http://wpml.org/documentation/support/wpml-contractors/

Before proceeding, I suggest reviewing the guidelines outlined here: http://wpml.org/documentation/support/wpml-contractors/guidelines-for-people-looking-for-consulting-help/
May 8, 2024 at 8:01 am #15604663

kevinT-10

Hi Kor

Please this video - hidden link

And also you can test in mobile view, you can see the dropdown menu uable to return

May 8, 2024 at 2:07 pm #15606668

Kor

Thank you for your response.

I've reviewed the information and understand the steps required. To achieve your desired outcome, you'll need to create a custom language switcher, following the instructions provided in this documentation: https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/adding-language-switchers-using-php-and-shortcodes/?utm_source=plugin&utm_medium=gui&utm_campaign=languages

Within the custom language switcher customization options, select the "Dropdown Click" feature, as illustrated in the attached screenshot. This will enable users to open and close the language switcher on mobile devices with a simple tap, similar to the functionality demonstrated on this page: hidden link

Feel free to access the sandbox site using the provided link to examine the settings firsthand. hidden link

Let me know if you have any further questions or if there's anything else I can assist you with.

Screenshot_26.png
May 9, 2024 at 3:58 am #15608323

kevinT-10

Thank you Kor,
the issue can be fixed.