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

Last updated by Marcel 1 month, 1 week ago.

Assigned support staff: Marcel.

Author Posts
September 2, 2019 at 10:33 am #4496325

sadafJ

Dear WPML
I can't solve my problem unfortunately, Please just let me know how can I change English Button to Farsi Button on my page . My original page is English page. I want to show on my original English page > Farsi Button.

I have 2 websites that I use WPML but I didn't expect to have the issue . Please observe mobile view . The arrow for dropdown menu is going on the right side and it is not possible to recognize dropdown menu. If you look my menu on Farsi page arrow position is in a wrong position.
I had conversion with my Divi Theme but they inform me that is from WPML.

I'm working in an advertising company and I explain to CEO that it is just a small issue and will be solve. I am under pressure because I persuade them to choose this plugin for translation.
hidden link
However , Thanks for your help.

Best regards
Sadaf

September 2, 2019 at 5:39 pm #4499435

Marcel
Supporter

Languages: English (English ) German (Deutsch )

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

Hi Sadaf,

If I understand your message correctly your problem is that the + from the language dropdown is overlapping the flag in Farsi, right? Or do you mean that the language switcher should appear left?

Please let me know
Best Marcel

September 4, 2019 at 12:15 pm #4510785

sadafJ

Dear Marcel
You understand correctly. When I change my language from English to other language which is RTL, the big problem happen in Menu bar. The arrow for dropdown menu doesn't move from LTR to RTL. Also that you understand correctly in mobile view + from the language dropdown is overlapping the flag in Farsi (RTL) for dropdown menu too.

Best regards
Sadaf

September 4, 2019 at 5:22 pm #4513149

Marcel
Supporter

Languages: English (English ) German (Deutsch )

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

Hi Sadaf,

thanks for the info, please give me some time to find a solution.

Best Marcel

September 5, 2019 at 8:46 am #4517139

Marcel
Supporter

Languages: English (English ) German (Deutsch )

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

Hi Sadaf,

#1 Dropdown Icon:
The dropdown icon is controlled from Divi, so you need to please contact for this the Divi support. This is not caused by WPML. I attached this scenario our former used Sandbox without activated WPML.

#2 + Icon on Mobile view:
I was not able to reproduce this issue. I attached you a screenshot from my Sandbox, where it's displayed correctly. So it looks like you have custom code on your page causing this issue. The WPML display is correct, but since Divi has a problem with the Dropdown Icon, it's overlapping there.

Test site: hidden link

If Divi didn't help you, I would recommend you to contact a certified WPML contractor here fixing this with custom code: https://wpml.org/contractors/

Another method is to change the Language switcher from "Dropdown" to "List" under WPML -> Language -> Menu language switcher. Doc: https://wpml.org/documentation/getting-started-guide/language-setup/language-switcher-options/

Best Marcel

September 5, 2019 at 7:49 pm #4521911

sadafJ

Dear Marcel,
#1 Dropdown Icon:
I spoke to support team of Divi. They told me :The issue will be solved in any future version of Divi.
But they didn't mention when they want to update Divi!!!!!!
I should contact a certified WPML contractor.

I just found and changed some codes with "Inspect" in google browser (right click and choose Inspect). This issue solved and I copy my code to add in CSS. but I didn't know, where and how can I put it.
-------------------------------------------------------------
The second issue <#2 + Icon on Mobile view:> about Collapse Nested Sub Menu Items. I added code in Divi, link below:
hidden link
Maybe it will be possible to change the code in the link above to fix view on mobile.
-------------------------------------------------------------
I stop to use WPML for real estate website, I think it will be very complicated. I used "Realtyna" package (hidden link), if the issues will be solve, I really be very happy because I like this plugin.

Best regards
Sadaf

September 6, 2019 at 9:42 am #4524545

Marcel
Supporter

Languages: English (English ) German (Deutsch )

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

Hi Sadaf,

Thanks for the information. You can add the CSS to a way described here:

- Divi: hidden link
- Or directly in WPML as described here: 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

If the CSS is not working, maybe you need to add a

!important

to the class.

I recommend you to contact a WPML certified developer to change Divi for you here https://wpml.org/contractors/. Our support policy don't allow us to provide custom code solutions.

Best Marcel

September 8, 2019 at 2:59 pm #4531885

sadafJ

Dear Sir,
Code below can solve my problem but I want that it is working only for Farsi Language RTL not English Language.

#et-secondary-nav .menu-item-has-children > a:first-child:after,
#top-menu .menu-item-has-children > a:first-child:after {
position: absolute;
top: 0;
right: 84px;
font-family: ETmodules;
font-size: 16px;
font-weight: 800;
content: "3"
}

I observed link below, somebody can do it , just one additional code for RTL needed.
like --"body.rtl" -- link below is for "icons" I want to have for Menu
https://wpml.org/forums/topic/rtl-issues-change-icons-in-divi-button/

I tried below code but it wasn't work.
body.rtl#et-secondary-nav .menu-item-has-children > a:first-child:after,
#top-menu .menu-item-has-children > a:first-child:after {
position: absolute;
top: 0;
right: 84px;
font-family: ETmodules;
font-size: 16px;
font-weight: 800;
content: "3"
}

I subscribed to the link that you sent but until now , I didn't receive any new.

Best regards
Sadaf

September 10, 2019 at 9:01 am #4543407

Marcel
Supporter

Languages: English (English ) German (Deutsch )

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

Hi Sadaf,

I see the dropdown symbol on "Products" is already on the left?

Please let me know

Best Marcel

September 10, 2019 at 9:55 pm #4549037

sadafJ

Dear Sir,
I find a way but it is not a correct way.
Below is my way:

1- I remove arrow by the code below from menu bar:

#et-secondary-nav .menu-item-has-children>a:first-child:after, #top-menu .menu-item-has-children>a:first-child:after {
position: absolute;
top: 0;
right: 0;
font-family: ETmodules;
font-size: 16px;
font-weight: 800;
content: "";
}

2- I did copy and paste arrow manually. I attached file (Copy Arrow).

It is not good way because I copied arrow manually on menu.
According my wrong way I cannot put arrow manually on " WPML Language dropdown menu ".

In my above code, all arrows will be remove from menu button even " WPML Language dropdown menu Arrow".
--------------------------------------------------
I attached a file (Good Sample Arrow) , How they did "Languages" in secondary Menu?

Best regards
Sadaf

September 11, 2019 at 3:09 pm #4554463

Marcel
Supporter

Languages: English (English ) German (Deutsch )

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

Hi Sadaf.

Thanks for the explanation. This example you posted is using a custom Theme where all the classes are different. I assumed your change first as a good idea for a WPML feature request, as you told me that Divi would add it to in a future release.

After further debugging, I found out that we have this functionality already, but the Theme controls it.

Here is the same test page we used before with the default WordPress Twenty Nineteen Theme. As you can see, the WPML language switcher dropdown icon is on the left. hidden link

(This Theme also shows the Menu dropdown icon correctly)

As this is controlled by Divi, please contact them again or hire a developer to change this functionality for you in Divi. There is sadly nothing we can provide you, as WPML has this already correct implemented.

Best Marcel