Skip Navigation

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

Problem:
The client wanted the language selector to appear in the same line as other menu items on their homepage. On inner pages, the language selector was displaying correctly, but on the homepage, it was dropping to a new line.

Solution:
We noticed that the inner pages were using an Elementor header template with left/right padding of 20px, while the homepage had a padding of 30px. To fix this, we suggested two options:
1. Adjust the menu items padding in the Elementor header template for the homepage to 20px.
2. Add custom CSS to the homepage's custom CSS section:

.elementor-171 .elementor-element.elementor-element-ab5b1bd .elementor-nav-menu--main .elementor-item {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

We recommended trying these solutions to see if they resolve the issue.

Please note that the solution provided might be irrelevant due to being outdated or not applicable to your case. If the issue persists, we encourage you to open a new support ticket. We also highly recommend checking related known issues, verifying the version of the permanent fix, and confirming that you have installed the latest versions of themes and plugins. If further assistance is needed, please contact us in the WPML support forum.

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 1 reply, has 2 voices.

Last updated by Noman 1 year, 2 months ago.

Assisted by: Noman.

Author Posts
February 19, 2024 at 8:47 am #15316414

vadonZ

I am trying to: I'd like to see language selector in the same line as other menu items

Link to a page where the issue can be seen: hidden link

I expected to see: language selector in the same line as other Menu items

Instead, I got: language selector goes into a new line in menu, but only on the home page, on the other pages it works properly

February 19, 2024 at 10:05 am #15317180

Noman
WPML Supporter since 06/2016

Languages: English (English )

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

Hi,

Thank you for contacting WPML Support. It seems the inner pages are using an Elementor header template that adds left/right padding of 20px, while the home page Elementor header template is set to 30px, causing this issue.

To resolve this, you can either adjust the menu items padding in the Elementor header template for the home page to 20px or use the following CSS in the custom CSS section:

.elementor-171 .elementor-element.elementor-element-ab5b1bd .elementor-nav-menu--main .elementor-item {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

I hope this resolves the issue. Please give it a try and let me know the results.

Thank you

February 20, 2024 at 12:21 pm #15322602

vadonZ

Thank you, I added as a custome CSS and worked exactley I expected. Have a great day!