Skip Navigation

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 4 replies, has 2 voices.

Last updated by gladysB 1 year, 10 months ago.

Assisted by: Mihai Apetrei.

Author Posts
June 27, 2023 at 12:27 pm #13902421

gladysB

Tell us what you are trying to do?
Hi! I would like to set WPML language switcher outside the mobile menu. The menu used on this website is a standard one as it is linked to a series of CSS to make it transparent on PC but white background and fixed on scroll on mobile, if I design a custom mobile menu the CSS break and stop working.

Is there a CSS to set the language switcher outside mobile menu only? Thank you in advance for your help!

June 27, 2023 at 5:11 pm #13905133

Mihai Apetrei
WPML Supporter since 03/2018

Languages: English (English )

Timezone: Europe/Bucharest (GMT+03:00)

Hi there.

You could hide that language switcher for mobile by using custom CSS.

You could use something like this:


ul#mobile_menu .wpml-ls-menu-item {
    display: none !important;
}

Then, add a custom language switcher (https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/adding-language-switchers-using-php-and-shortcodes/) from the theme's files, in the theme's code, and that will display exactly where you want on the front-end.

It might take some time to dig a bit deeper into the theme's code to see where you want to get that language switcher to show up.

Kind regards,
Mihai Apetrei

June 27, 2023 at 7:47 pm #13906039

gladysB

Thank you very much for your kind reply. I have set up the custom language switcher and added it through the theme header.php. It is left aligned, though, see screenshot. How can I have it right-aligned, below the hamburger menu, please? Thank you!

WhatsApp Image 2023-06-27 at 20.47.19.jpeg
June 29, 2023 at 1:49 pm #13918449

Mihai Apetrei
WPML Supporter since 03/2018

Languages: English (English )

Timezone: Europe/Bucharest (GMT+03:00)

Hi there.

You can try something like in this example:


.wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-vertical {
    float: right;
    margin-right: 48px;
}

Mihai