missing CSS in language-switcher while using website-editor? - WPML

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: Custom Work, Documentation request

This topic contains 1 reply, has 2 voices.

Last updated by Waqas Bin Hasan 1 year, 10 months ago.

Assisted by: Waqas Bin Hasan.

Author	Posts
July 20, 2023 at 1:41 pm #14072847
marenB	Hi WPML-team, we are working with a twentytwentythree-based theme and the website-editor. adding your language-switcher to a navigation shows the switcher but the design is weird - no uppercase and no styling. trying to use some custom css failed because there is no CSS for styling in the code!? just: data-wpml ??? https://wpml.org/wp-content/uploads/tmp/switcher_in_FSE_navigation_PNG.png using your language-switcher in the footer works as expected with nice CSS: https://wpml.org/wp-content/uploads/tmp/switcher_in_footer_PNG.png is this a bug? is there another way to mark the current language? regards Maren
July 21, 2023 at 11:25 am #14079359
Waqas Bin Hasan WPML Supporter since 05/2014 Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)	Hi, Thank you for contacting the support. By default, WPML does not render language switchers with its own HTML. Instead, it injects the language switcher elements into the menu structure. This way, your theme renders the language switcher just like other menu items. Basically, this allows the language switcher to look better on your site, taking on the look of your theme’s CSS rules. I'll suggest checking these guides: - https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/ - https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/how-to-fix-styling-and-css-issues-for-the-language-switchers/#customizing-a-language-switcher-with-css - https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/custom-language-switcher/ On the other hand, you can always target an element based on a CSS selector, like for an attribute either it's a standard one or a custom (i.e. data-wpml), please see following articles: - hidden link - hidden link You can also target based on current language, see https://wpml.org/forums/topic/split-problem-with-menu-styling-in-secondary-language/ for an example. Regards.