[Support request] Disable mobile view

Home Forums Support [Support request] Disable mobile view

Home Forums Support Disable mobile view

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #2057055
    Allen

    hi

    Currently I am using this snippet to disable mobile view, and its working fine in mobile.

    add_filter( 'generate_meta_viewport', function() {
        return '<meta name="viewport" content="width=1024">';
    } );

    a) How can I fix my width at 1200 for desktop? and do not resize accordingly.
    b) How can I keep my search bar within sidebar?

    Thank you!

    #2057224
    Elvin
    Staff
    Customer Support

    Hi there,

    for A)

    You can change 1024 to 1200 on the content attribute but I personally don’t recommend doing this as the page will likely not be readable on smaller devices.

    But you can try this.

    <meta name="viewport" content="width=1200, initial-scale=1.0, maximum-scale=2, minimum-scale=0.5">

    for B)

    try adding this CSS:

    .inside-right-sidebar form.searchandfilter * {
        width: 100%;
        padding-right: 0px;
    }

    A wise man once said:
    "Have you cleared your cache?"

    #2058153
    Allen

    hi!

    A)
    Thanks for the suggestion! Found out I am able to achieve what I want with

    body .grid-container {
        min-width: 1200px;
    }

    and

    add_filter( 'generate_meta_viewport', function() {
        return '<meta name="viewport" content="width=1024">';
    } );

    Can I know how can i keep sidebar even browser size is smaller than 768px? Currently both will hide.

    b) work perfectly!

    Thank you!

    #2058358
    David
    Staff
    Customer Support

    Hi there,

    The sidebars are being hidden by your CSS:

    @media (max-width: 768px) {
        #right-sidebar, #left-sidebar {
            display: none;
        }
    }

    Remove that.

    And if you want to try and keep the desktop layout add this CSS:

    @media (max-width: 768px) {
        #content {
            flex-direction: row;
        }
        .is-left-sidebar.sidebar, .is-right-sidebar.sidebar {
            width: 20%;
        }
        .is-left-sidebar.sidebar {
            order: -10;
        }
    }

    But i am not sure how this is going to work on such a small screen.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.