Return to previous page

How to set breakpoints for menu (switch between desktop and mobile)

This topic has 8 replies, 3 voices, and was last updated 10 months, 2 weeks ago ago by Andrew Mitchell

Martin

Participant

February 7, 2024 at 16:22

Hello,

I would like the desktop menu to collapse earlier into the mobile menu. As you can see in the attached screenshot, it breaks into 2 lines instead, not leaving enough space for other header elements.

On some of your demo sites it seems to work fine, changing to mobile at an earlier breakpoint. Where can I set those up?

Thanks, best regards
Martin

#382720 Copied Theme version: 5.2.7

7 Answers

Rose Tyler

Support staff

February 7, 2024 at 16:32

Hello, Martin,

Thank you for reaching out to us with your query.

Theme Options > General > Starting Point Of The Mobile Header.

Best Regards,
8Theme’s Team

#382723 Copied

Martin

Participant

February 8, 2024 at 09:52

Hello Rose,

thanks a lot, that solved that issue, but led to another one. Now there is a phase between 1024 and 1300 px viewport width when the header is not visible (see screenshot).

First, I thought it could be a conflict with elementor, where the global width was set to 1024. I adjusted it to 1300 (same width as in xstore) but that did not help.

It does not appear to be a problem with z-index. There is no overlay above the header and I checked the z-index of the first block in elementor.

Best regards
Martin

Files is visible for topic creator and
support staff only.

#382787 Copied

Rose Tyler

Support staff

February 8, 2024 at 10:31

Hello, Martin,

We appreciate your prompt response.

Could you please provide temporary wp-admin access?

Best Regards,
8Theme’s Team

#382802 Copied

Martin

Participant

February 8, 2024 at 10:49

Hello,
here you go, thank you!
Best regards
Martin

Please contact administrator
for this information.

#382809 Copied

Rose Tyler

Support staff

February 8, 2024 at 11:46

Hello, Martin,

Upon review, we have identified that the problem appears to stem from the ‘margin-top’ setting (as shown in this screenshot: https://prnt.sc/-ITKh-zDqZl3) for the initial container on the Home page. We kindly request that you examine the settings and remove the negative margin. Subsequently, please clear the cache and verify the outcome.

Best Regards,
8Theme’s Team

#382819 Copied

Martin

Participant

February 8, 2024 at 12:14

Hi Rose,

thank you very much, and sorry for bothering you with that.

I had checked the margins before, but overlooked the deactivated breakpoints views in elementor. Turns out, old margin settings were preserved in those views.

Thanks a lot, best regards
Martin

#382824 Copied

Andrew Mitchell

Support staff

February 8, 2024 at 12:14

Dear Martin,

As we continue our mission to exceed expectations, your insights become increasingly valuable. Could we, with all due respect, request your thoughtful feedback by giving our theme a deserved 5-star rating on ThemeForest?

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

Your time and trust are highly appreciated!

Best Regards,
The 8Theme Team

#382825 Copied
Tagged: customize wordpress menu, mobile desktop switch, responsive woocommerce templates, set menu breakpoints, woocommerce breakpoints, woocommerce tutorial, wordpress templates
Viewing 8 results - 1 through 8 (of 8 total)

The issue related to '‘How to set breakpoints for menu (switch between desktop and mobile)’' has been successfully resolved, and the topic is now closed for further responses

How to set breakpoints for menu (switch between desktop and mobile)

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection