Skip Navigation

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

Problem:
You are trying to modify the appearance of the language change button in the mobile header of your site by rounding off its angles.
Solution:
We recommend using CSS to achieve the rounded borders for your language switcher. You can start by adding the following CSS code:

.wpml-ls-item-toggle {<br />border-radius: 15px;<br />}

You should add this CSS in the WPML >> Languages >> Additional CSS section. For more detailed instructions, please refer to our documentation on how to fix styling and CSS issues for language switchers: https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/how-to-fix-styling-and-css-issues-for-the-language-switchers/

If this solution does not apply to your case, or if it seems outdated, we highly recommend checking related known issues at https://wpml.org/known-issues/, verifying the version of the permanent fix, and confirming that you have installed the latest versions of themes and plugins. If you need further assistance, please open a new support ticket at https://wpml.org/forums/forum/english-support/.

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 1 voice.

Last updated by claraH-3 4 weeks, 1 day ago.

Assisted by: Noman.

Author Posts
December 7, 2024 at 10:31 pm #16488971

claraH-3

Background of the issue:
I am trying to modify the appearance of the language change button in the mobile header of my site, hidden link, by rounding off its angles.

Symptoms:
No specific issue or error message mentioned.

Questions:
How can I round off the angles of the language change button in the mobile header?

December 8, 2024 at 10:15 am #16489497

Christopher Amirian
Supporter

Languages: English (English )

Timezone: Asia/Yerevan (GMT+04:00)

Hi,

Welcome to WPML support. I will try to answer the question before the ticket is assigned to one of my colleagues.

There is no built-in option in WPS settings to make the border of the language switcher rounded. You will need to use CSS to achieve such a feature.

We do not provide custom CSS code as this is something that is outside of our support scope, but to get started, you can use the code below and fine-tune your mobile language switcher:

.wpml-ls-item-toggle {
border-radius: 15px;
}

Thanks.

December 8, 2024 at 12:17 pm #16489703

claraH-3

Hi,

thank you for your feedback!
Do you know where I should enter this code?

Thank you in advance for your help

Kind regards

December 8, 2024 at 2:02 pm #16489869

Noman
Supporter

Languages: English (English )

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

Hi,

Thank you for contacting WPML Support. You may add that CSS in WPML >> Languages > Additional CSS section as you can see in the attached screenshot.

Here is a doc for more details: https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/how-to-fix-styling-and-css-issues-for-the-language-switchers/

Please let me know if this resolves the issue or if you need further assistance with this issue.

Thank you

Additional CSS section.png
December 10, 2024 at 3:29 pm #16499340

claraH-3

Perfect! Thank you!