Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • June 8, 2016 at 5:38 pm #644967
    pako69

    Hi
    WP Rocket is a great cache plugin that you know :)
    It has many options like CSS, HTML and JS Minification.

    If you use WP Rocket and CSS Minification is activated the new feature that hide columns and cells on mobile devices will not work.

    I have done some simple tests with a simple page with 2 cells, the first one should be hidden on mobile, the other one always display.
    I always viewed this page first on my browser then on my iPhone, and purge the cache of this page before.
    – without WP Rocket : it works
    – with WP Rocket and HTML minification : it works
    – with WP Rocket and HTML minification + JS Minification : it works
    – with WP Rocket and HTML minification + CSS Minification : it do not works > the first cell is displayed on my mobile
    – with WP Rocket and CSS Minification : it do not works > the first cell is displayed on my mobile
    > So the issue is with CSS Minification…

    I do not know how Enfold detect mobile, maybe wp_is_mobile() ? WP Rocket can works well with WordPress themes that use wp_is_mobile()

    Go there http://www.pascal-bourhis.net/test with you mobile and you should see the first cell (blue background) that should be hide on mobile.

    June 8, 2016 at 5:47 pm #644973
    Guenni007

    i suppose that this is a problem by minifying a media querry advice.

    something like this here:

    @media only screen and (max-width: 1024px) {.responsive #top .av-hide-on-mobile, .responsive #top .av-hide-on-tablet {
    display: none !important;
}
}

    some minifying tools lost some important brackets here etc.

    June 8, 2016 at 6:28 pm #644987
    pako69

    @Guenni007
    If I’m not wrong, the CSS you gave do not exist in this Enfold version…

    The online CSS line that exist with the class .av-hide-on-mobile is in layout.css, line 3590:
    .responsive #top .av-hide-on-mobile, .responsive #top .av-hide-on-tablet{display:none !important;}

    EDIT:
    Enfold do not use wp_is_mobile() but:

    
    	if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) && 'ontouchstart' in document.documentElement)
    	{
    		$.avia_utilities.isMobile =  true;
    	}
    	else
    	{
    		$.avia_utilities.isMobile =  false;
    	}
    June 8, 2016 at 6:45 pm #644994
    pako69

    I’v found that if I exclude http://www.pascal-bourhis.net/wp-content/uploads/dynamic_avia/pascal_bourhis_enfold.css from being to be cached : IT WORKS!
    It’s always that dynamic CSS that bored me… I do not understand why this file is not at the same place than the others CSS.

    June 8, 2016 at 9:01 pm #645063
    Basilis

    Hi!

    Glad you got it solved.
    Also the code you got provided, even if not included, it can be used for sure.
    Anyway, feel free to open a new ticket, if needed.

    Regards,
    Basilis

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Hide columns and cells on mobile devices will not work with WP Rocket’ is closed to new replies.