Popie Matsouka

Problem:

The client experienced issues with their website after using WPML to translate it. The translated webpages displayed without images, texts were overlapping, and the language switcher widget was not displaying properly. The root cause was identified as theme design issues exacerbated by the addition of the language switcher and longer text in menu translations.

Solution:

We provided a CSS fix to address the layout issues caused by the language switcher and menu translations. The client should add the following CSS in WPML->Languages->Language URL options->Additional CSS:

img.wpml-ls-flag {
        width: 16px;
    height: 16px;
}
li.wpml-ls-item {
        padding: 0px !important;
    margin: 0px 15px 0px 0px !important;
    width: 50px;
}
.fusion-main-menu>ul>li {
        padding-right: 20px !important;
}

For the missing images, specifically the logo, the client should go to the Avada options, switch to the secondary language, and add the logo translations. Selecting a smaller size for the logo may be necessary if it appears too large.

If this solution does not resolve your issues or seems outdated, we recommend checking related known issues at https://wpml.org/known-issues/, verifying the version of the permanent fix, and confirming that you have installed the latest versions of themes and plugins. If problems persist, please open a new support ticket.