Please make sure to update to WPML 4.3.6 and check our list of Known Issues before reporting

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:

Client's language switcher is missing when page is viewed in mobile device.

Solution:

Add CSS code snippet to WPML > Languages > Additional CSS:

@media (max-width: 767px) {
#header:not(.header-builder) .header-top {
    display: block !important;
}
}
  
@media (max-width: 767px){
#header:not(.header-builder) .switcher-wrap {
display: inline-block !important;
}
}

This topic contains 4 replies, has 2 voices.

Last updated by setyo-hadiJ 1 year, 1 month ago.

Assigned support staff: Dennis.

Author Posts
December 12, 2018 at 1:39 am

setyo-hadiJ

I am trying to: Before updating, i can switch between langguage on mobile

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

I expected to see: language switcher on mobile or responsive site

Instead, I got:language switcher is disapear, but in web full view it normal

December 12, 2018 at 7:20 am #2991841

Dennis

Hi,

Thank you for contacting WPML Support.

#1

Please increase the PHP Memory Limit (your current setting is 40M). Minimum requirements are 128Mb:

https://wpml.org/home/minimum-requirements/

You can add this to wp-config.php to increase WP memory:

/** Memory Limit */
define('WP_MEMORY_LIMIT', '256M');
define( 'WP_MAX_MEMORY_LIMIT', '256M' );

- Add it above the line

 /* That's all, stop editing! Happy blogging. */ 

Keeping WPML within minimum requirements can help you get rid of plugin unusual behavior.

#2

You can’t see the language switcher (in mobile view) because the theme’s media queries is set to hide the top header while viewing it on a mobile device. To make visible even in mobile view kindly try to add this CSS code snippet in WPML > Languages > Language switcher options. Click “Additional CSS” and copy the code snippet below. Leave the text box to auto-save.


@media (max-width: 767px)
#header:not(.header-builder) .header-top {
    display: block;
}

@media (max-width: 767px)
#header:not(.header-builder) .switcher-wrap {
display: inline-block
}

Let me know how it goes.

Kind regards,
Dennis

December 13, 2018 at 6:15 am #2996242

setyo-hadiJ

Dear denis,

I do your guide, but that not resolve my proble. can you have a look

December 13, 2018 at 6:29 am #2996264

Dennis

Hi,

Can you update the code with this code?


@media (max-width: 767px) {
#header:not(.header-builder) .header-top {
    display: block !important;
}
}
 
@media (max-width: 767px){
#header:not(.header-builder) .switcher-wrap {
display: inline-block !important;
}
}

Let me know the result!

Kind regards,
Dennis

December 13, 2018 at 6:55 am #2996323

setyo-hadiJ

My issue is resolved now. Thank you!