Skip Navigation

Home › Support › English Support › [Resolved] Menus broken layout due to WPML

[Resolved] Menus broken layout due to WPML

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

Problem:
The client's WordPress menus layout on WP Admin -> Appearance is broken, and the issue persists even after switching to the default theme and deactivating other plugins.

Solution:

This issue was resolved on WPML v.4.6.8 update.

The solution below was provided before WPML 4.6.8 release:

1) Create a file named 

wp-admin-menu.css

in the theme folder.
2) Insert the following CSS code into the newly created file:

.nav-menus-php .major-publishing-actions{display:block;}
#menu-name{margin-left:0;}
#icl_menu_language,
#icl_menu_translation_of{margin-left:0;}

3) Add the following code to the 

functions.php

file in the theme folder:

/* Admin CSS styles */<br />function adminStylesCss() {<br />    $url = get_option('siteurl');<br />    $url = $url . "https://cdn.wpml.org/wp-content/themes/your-theme-name/wp-admin-menu.css";<br />    echo '<!-- Admin CSS styles --><br />          <link rel="stylesheet" type="text/css" href="' . $url . '" /><br />          <!-- /end Admin CSS styles -->';<br />}<br />add_action('admin_head', 'adminStylesCss');

This will add a CSS file to the WP admin to correct the layout in the Appearance -> Menus section. Before making any changes, ensure to have a full backup of the website and clear the browser cache in the WP admin after adding the code.

If this solution does not seem 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 1 reply, has 2 voices.

Last updated by Marsel Nikolli 1 year, 1 month ago.

Assisted by: Marsel Nikolli.

Author Posts
November 17, 2023 at 2:29 pm #14863555

jose-antonioP-6

Our Menus layout is broken due to WPML, we have tried with default theme and plugins but still have same issue.

Please see attached screenshot.

menus.JPG
November 17, 2023 at 4:10 pm #14864973

Marsel Nikolli

Hi,



Thank you for contacting WPML Support, I will be happy to help you today.


This seems to be a CSS issue, could you please follow the steps below:

1) Create a file named "wp-admin-menu.css" on your theme folder
2) Add the following code on that file:

.nav-menus-php .major-publishing-actions{
  display:block;
}

#menu-name{
   margin-left:0;
}

#icl_menu_language,
#icl_menu_translation_of{
   margin-left:0;
}

3) Add the following code on your functions.php file on your theme folder:

/* Admin CSS styles */
function adminStylesCss() {
    $url = get_option('siteurl');
    $url = $url . "/wp-content/themes/your-theme-name/wp-admin-menu.css";
    echo '<!-- Admin CSS styles -->
          <link rel="stylesheet" type="text/css" href="' . $url . '" />
          <!-- /end Admin CSS styles -->';
}
add_action('admin_head', 'adminStylesCss');

This should add a CSS file on the WP admin which corrects the layout on the Appearance -> Menus.

* Please make sure you have a full backup of your website before you make any changes, and clear the browser cache on the WP admin once you add the code.

Let me know if this works out for you,
Marsel
November 20, 2023 at 9:43 am #14874537

jose-antonioP-6

Thanks for the snippet.