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 thread is resolved. Here is a description of the problem and solution.

Problem: Can i make the custom Language Switcher dropdown background and border transparent in Themeco's X/PRO Theme?

Solution: Out of the box, it's not possible to do that for dropdown menus, but you can use the following custom css to achieve that:

.wpml-ls-legacy-dropdown a {
    border: none;
    background-color: transparent;
 }

You can also use the following classes if you want to modify other states:

.wpml-ls-legacy-dropdown a:hover /* Hover State */
.wpml-ls-legacy-dropdown a:focus /* Focus State */
.wpml-ls-legacy-dropdown .wpml-ls-current-language:hover>a /* Current Language Item */

This topic contains 2 replies, has 2 voices.

Last updated by romanA-5 11 months, 3 weeks ago.

Assigned support staff: Alejandro.

Author Posts
October 26, 2018 at 10:46 am

romanA-5

I am trying to:

Remove the default styling of language switcher (border,background-color,etc)

Regarding link, I selected on the options of the support ticket.
The language switcher is inserted on themeco pro theme header with shortcode.

I expected to see: A switcher with tranparent background and without border.

Whatever css selector I use, nothing changes, even if I add to the "Additional CSS" section.

October 26, 2018 at 4:12 pm #2853635

Alejandro
Supporter

Languages: English (English ) Spanish (Español ) Italian (Italiano )

Timezone: Europe/Rome (GMT+02:00)

Hello!
Welcome to WPML Support.
I'll do my best to help you solve this issue.

You're right, it's not possible to add transparency to the Language Switcher at the moment but it would make a very nice feature request!

In the meantime, you can use the following class. I suggest you add it to PRO > Header > *Select and edit your header* > CSS (button/icon found in The Bar):

.wpml-ls-legacy-dropdown a {
    border: none;
    background-color: transparent;
 }

You can also use the following classes if you want to modify other states:

.wpml-ls-legacy-dropdown a:hover /* Hover State */
.wpml-ls-legacy-dropdown a:focus /* Focus State */
.wpml-ls-legacy-dropdown .wpml-ls-current-language:hover>a /* Current Language Item */

I hope this solves your problem, let me know if you continue to have the same issue, though.

If you have other questions you can close this ticket and create another (and assign it to me, if you want. i'll happily do my best to help you), We can only answer to one question per ticket, as per WPML Forum Policy.

October 29, 2018 at 10:14 am #2857446

romanA-5

My issue is resolved now. Thank you!