Skip Navigation

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

Problem:
The client is experiencing issues with the appearance of WPML language flags in the menu, which do not look aesthetically pleasing due to the menu titles.
Solution:
We recommend adding custom CSS to improve the appearance of the language flags. Here are the steps to follow:
1. Navigate to your site's backend.
2. Go to Appearance > Customizer > Additional CSS area.
3. Add the following CSS code:

.wpml-ls-item .sub-nav {<br />width: 60px !important;<br />}

4. Save the changes.
This should adjust the width of the dropdown menu to look better. However, if you're looking to have the flags under a world icon with a transparent background, this would require custom coding. Custom work is beyond our support policy, so you may need to hire a developer or consider reaching out to a WPML contractor.

If this solution doesn't look relevant to your issue, please open a new support ticket with us.

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 Mihai Apetrei 1 year, 5 months ago.

Assisted by: Mihai Apetrei.

Author Posts
December 22, 2023 at 11:14 pm #15121875

fatihA-10

My website address is drmertakbas.com.tr
When adding wpml language flags, it looks very bad due to the menu titles. The site I added also uses wpml. How can I fix flag menu like
Other site address: hidden link
If you need to review the site login information

site login information
**Hidden**

December 23, 2023 at 6:31 pm #15122855

Mihai Apetrei
WPML Supporter since 03/2018

Languages: English (English )

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

Hi there.

Please go into your site's backend > Appearance > Customizer > Additional CSS area > add the following CSS code and save:

.wpml-ls-item .sub-nav {
width: 60px !important;
}

Now, the dropdown menu should look like in the screenshot I attached below (you will see two screenshots: one with the current state, and the other one with the CSS code applied).

Have lovely holidays!

Mihai Apetrei

Screenshot 2023-12-23 at 22.22.08.png
Screenshot 2023-12-23 at 22.28.48.png
December 24, 2023 at 1:46 pm #15124309

fatihA-10

Thanks for the reply. Is it possible to show this under a world icon and make the background transparent?

Screen Shot 2023-12-23 at 01.52.09 AM.png
December 26, 2023 at 8:49 am #15128657

Mihai Apetrei
WPML Supporter since 03/2018

Languages: English (English )

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

Hi there.

This kind of design will require custom coding and custom work falls out of the purpose of our Support Policy.

You will need to hire a developer or a WPML contactor (https://wpml.org/contractors/) if you need that exact design.