Hi,
in an iPad, the menu is not mobile, it is especially not working for vertical orientation, but even for the horizontal ipad, it would be nic eto have the coice to put the mobile menu.
Is that possible ? or how can I cange the code to have the mobile menu on vertical ipad ?
Thank you!
Francoise
Hi,
Please provide a link to your website so we can inspect it, the menu should display in every situation, depending on the device. This is how the demo looks on an iPad in portrait – https://www.screencast.com/t/iamUi5zAQ and in landscape – https://www.screencast.com/t/NlltWQrYzQ0
To achieve something as to display the mobile menu in this situation it would require probably major changes to the theme files and media queries and a lot of hard work changing the design of the theme. This feature applies in certain situations based on the screen size, and there are a lot of automatic functions that are involved in the process.
Thanks
Hi,
this is the website: https://www.chronicleproject.com/
Most theme switch to mobile menu on tablet vertical (or under 800px), or offer the choice
Thank you.
Hi,
Unfortunately I can not give you a definite solution for this. This is the way the theme was designed, and if it would be easy as to just change a line of code I would be more then happy to help you. But as I said it requires major changes to change the breaking point for the mobile menu to display, and no solution was provided on this forum regarding this as a reference point. Please keep in mind that this could be a theme option in a future update, but I can not say for sure if or when this will happen. I am sorry that I could not provide you with a solution in this matter.
Thank you for understanding!
Hello,
I found this, along with similar posts, while trying to achieve the same: The mobile menu instead of the full/mega menu on portrait tablet view.
I believe I’ve found a solution which I’d like to share, I have added the following code to my child theme:
@media (max-width: 1018px) {
#td-outer-wrap {
overflow: auto;
margin: auto;
width: 100%;
-webkit-transition: transform 0.7s ease;
-moz-transition: transform 0.7s ease;
-o-transition: transform 0.7s ease;
transition: transform 0.7s ease;
-webkit-transform-origin: 50% 200px 0;
-moz-transform-origin: 50% 200px 0;
-o-transform-origin: 50% 200px 0;
transform-origin: 50% 200px 0;
}
}
@media (max-width: 1018px) {
#td-top-mobile-toggle {
display: inline-block;
position: relative;
}
}
@media (max-width: 1018px) {
.admin-bar #td-mobile-nav {
padding-top: 46px;
}
}
@media (max-width: 1018px) {
#td-header-menu .menu-mega-topics-container{
display:none;
}
}
}
I’ve yet to test this very extensively, so if anyone uses this and identifies any issues, please share.
I hope it helps.
Thanks.