Dante – How to change minimum window-width when Mobile Menu appears?

[Turnleaf]

The Mobile Menu starts being displayed at too wide a browser-window width for my setup (in my case it appears at a Chrome window-width of 1008 pixels).

I would like it to only appear if my browser window is narrower than 800 pixels.

Where and how do I change the minimum window-width below which the Mobile Menu appears?

[Mohammad – SUPPORT]

Hi,
Which version theme is being used by you . Our demo [http://dante.swiftideas.net/] is working perfect as you want .

Thanks 🙂
With Best Regards
Swift Ideas

[Turnleaf]

I want to be able to set my own width for when the mobile menu appears.
Where is the variable where I can set this?

Thanks.

[Melanie – SUPPORT]

Hey, sorry for the misunderstanding, I don’t know what Mohammad was referring to.
You cannot set just a variable for this, you need to modify the theme files.

So in responsive.css you find this code

/* --------------------------------------------
	iPAD/TABLET PORTRAIT
-------------------------------------------- */

and afterwards you’ll find the code that kicks in in ipad portrait mode, so

#main-navigation {
		display: none;
	}
	.header-1 #main-nav, .header-1 #main-nav-sticky-wrapper, .header-1 .header-left, .header-1 .header-right, .header-2 #main-nav, .header-2 #main-nav-sticky-wrapper {
		display: none;
	}

for example hides the navigation and the sticky wrapper on mobile. So if you want to change that you need to copy the code (including the @ media query) and modify the values of the media query

@media only screen and (max-width: 991px) {

according to your liking.
Then you need to copy all the other css that is affected by the responsive css for that section.

If you’re unsure how to do that please hire a developer of your trust to help you with that.

Cheers

[Turnleaf]

Thanks Melanie!

Since this is quite complicated for most people, could you suggested to the theme developers that they give users a preference setting for the “window width” at which the Mobile Menu appears?

Thank you!

[Swift Ideas – Ed]

Hi @Turnleaf – it’s on the list. Hoping to sort out a dropdown in the theme options that lets you choose wether the mobile header starts at tablet portrait, tablet landscape, or mobile.

– Ed

[Turnleaf]

@Ed: thanks for responding personally, great!

While you’re add it, could you also make it so that even on mobile, the Mobile Menu does NOT appear?
(If that’s already possible, please let me know how I can achieve this?)

Thanks!

[Swift Ideas – Ed]

@Turnleaf – not sure what you mean? You don’t want the menu button visible on mobile?

– Ed

[Turnleaf]

I meant there should be a preference to be able to make menu look exactly identical in both mobile and desktop layouts.

[Melanie – SUPPORT]

Thank you for the feedback!

[Swift Ideas – Ed]

@Turnleaf – it would be impossible for the standard menu to fit on mobile view, and it wouldn’t be user friendly at all.

– Ed

[Turnleaf]

@Ed: when there are only very few menu items, it might well fit. Let is have the option, so we can decide for ourselves? Thanks!

[Kyle – SUPPORT]

Hi

Not had anyone else request this, and it’s not as simple as just adding it as an option for you to decide, it would mean we would have to spend time building it into the theme, which we don’t have time to do as we are working on adding more requested features.

Hope you understand

– Kyle

[Turnleaf]

I do understand your resource constraints.

[Kyle – SUPPORT]

Appreciated

– Kyle