The mobile version is not displaying the gallery correctly. And the menu is not working properly

This topic has 11 replies, 4 voices, and was last updated 9 months, 3 weeks ago ago by Andrew Mitchell

  • Avatar: st7878
    st7878
    Participant
    February 28, 2024 at 12:51

    Hi,

    Please help
    1) Gallery.
    In the mobile version, all gallery images overlap with other blocks on the site. I applied such galleries on the page https://test.hottabych.ua/small_service/ and https://test.hottabych.ua/shirts/

    2) Popups menu.
    I created a menu through a popup window, configured the background of menu items, but for some reason it appears gray. How to get rid of it?

    3) Mobile menu xStore.
    The first list is not displayed when you open it. All subsequent ones work fine.

    For more details see the video at the link:
    https://fex.net/ru/s/5sel7la

    10 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    February 28, 2024 at 14:13

    Hello, St7878,

    Thank you for reaching out to us with your concerns. We appreciate you bringing these issues to our attention and we’re here to help ensure your website runs smoothly.

    1/ We kindly request that you insert the following code into the Settings of the element https://prnt.sc/CBbGJwO2xgrs which has the problem:

    @media only screen and (max-width: 480px) {
       selector.elementor-widget-etheme_gallery {
            min-height: 400px !important;
        }
    }

    the 400px value can be changed.

    2/ The background color comes from the plugin – https://prnt.sc/TPMF72Y5Mlo_ If you can’t find where to change it via the plugin settings, custom CSS code can be used:

    .elementor-nav-menu--dropdown .elementor-item:focus {
        background-color: transparent !important;
    }

    3/ Please add the next code in Theme Options > Theme custom CSS > Global:

    .mobile-menu-popup .et_b_header-menu li>.nav-sublist-dropdown:not(.nav-sublist) {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    We hope this answer is helpful.

    Best Regards,
    8Theme’s Team

    Avatar: st7878
    st7878
    Participant
    February 28, 2024 at 14:35

    2 and 3 are super! It works, thanks. But the first problem is not solved(((

    Files is visible for topic creator and
    support staff only.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    February 28, 2024 at 14:52

    Hello, St7878,

    We appreciate your prompt response.

    Could you please provide temporary wp-admin access?

    Best Regards,
    8Theme’s Team

    Avatar: st7878
    st7878
    Participant
    February 28, 2024 at 16:12

    Ok

    Please contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    February 28, 2024 at 16:18

    Hello, St7878,

    Please change the code to:

    @media only screen and (max-width: 480px) {
       selector.elementor-widget-etheme_gallery {
            min-height: 400px !important;
        }
    }

    Best Regards,
    8Theme’s Team

    Avatar: st7878
    st7878
    Participant
    February 28, 2024 at 16:30

    https://test.hottabych.ua/small_service/

    What you are suggesting is not a solution. After all, the problem is global. Galleries can be different and have different heights. By limiting the minimum height we will not solve the problem, we will hide it…..

    Files is visible for topic creator and
    support staff only.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    February 28, 2024 at 17:05

    Hello, St7878,

    Yes, galleries have different heights, and the height can be changed in the code.
    “selector” means the code works for the element where it is added, so when you have 2 galleries on page, just add code for 2 elements, and set different appropriate heights.

    Best Regards,
    8Theme’s Team

    Avatar: st7878
    st7878
    Participant
    February 28, 2024 at 17:16

    I realized that you want me to code to adjust the height for the mobile version. But I don’t think that’s a solution to the problem. It’s masking the problem. After all, in the desktop version you don’t need to set the height, even in the elementor builder, when you turn on the preview of the mobile version – everything is displayed well without any minimum height restrictions. Why?

    Files is visible for topic creator and
    support staff only.
    Avatar: Justin
    Luca Rossi
    Support staff
    February 29, 2024 at 06:30

    Hi @st7878,

    Please remove all the previous custom CSS codes, we’ve added this custom CSS code under Theme Options > Theme Custom CSS > Global CSS:

    
    .elementor-widget-etheme_gallery {
        width: 100%;
    }
    

    And now all the galleries are working fine. Can you please double check?

    Best Regards,
    8Theme’s Team

    Avatar: Andrew Mitchell
    Andrew Mitchell
    Support staff
    February 29, 2024 at 09:13

    Dear st7878,

    Choosing our theme reflects your commitment to quality, and for that, we’re genuinely grateful. As we constantly strive to elevate your experience, your feedback is an invaluable gift. Could you kindly take a moment to rate our product with 5 stars on ThemeForest?

    Click here to share your insights: https://themeforest.net/downloads

    Your support fuels our journey, and we appreciate it more than words can express.

    Best Regards,
    The 8Theme Team

  • Viewing 11 results - 1 through 11 (of 11 total)

The issue related to '‘The mobile version is not displaying the gallery correctly. And the menu is not working properly’' has been successfully resolved, and the topic is now closed for further responses

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.