Return to previous page

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 8 months, 3 weeks ago ago by Andrew Mitchell

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

#385115 Copied Theme version: 9.2.8

10 Answers
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
#385136 Copied
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.

#385141 Copied

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

#385145 Copied

st7878

Participant

February 28, 2024 at 16:12

Ok

Please contact administrator
for this information.

#385153 Copied
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
#385155 Copied
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.

#385157 Copied

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

#385161 Copied

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.

#385164 Copied
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
#385193 Copied
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

#385221 Copied
Tagged: best selling themes, gallery display problems, menu functionality error, mobile version issues, troubleshooting woocommerce, woocommerce themes
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

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

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection