[bassicsax]

After years of using Tempera, I decided my website needed a visual upgrade, so I installed Bravada first on my test site (no issues) and then on my website.

On my website I have a lot more pages than I do on my test site. I suddenly found out that Bravada does not appear to support navigation for websites that have multiple child pages nested under parent pages.

On my laptop, the more child pages you click on in the navigation, the more crowded the print becomes. These then end up piling on top of the existing page menu items, to the point where nothing is readable.

For example, if one goes this path from the top right navigation menu:

Home > Vintage Saxes > European-Made Saxes > Hohner President > Hohner Brochure

You will see what I am referring to.

It only gets worse the further one goes into child pages.

Although on mobile devices the navigation is a bit better, it text still overlaps on the child pages.

Is there a way to fix this? Is there something I am not seeing?

I am very happy with Bravada. I was considering buying it for both my website and the magazine portion of my site. However, unless I can get the navigation issues figured out, I am not sure it is the right fit for my site.

Thank you for your themes. You folks put together some of the nicest themes I have ever seen!

Regards,

Helen

Website: bassic-sax.info/version5

[Kay]

Hi Helen!

Wow, I didn’t know there were so many saxes.

Because in Bravada we chose to animate the menu’s height, and because of some limitations in CSS we had to choose an arbitrary maximum height for the submenus. And we went with 1000px. In your case, with multiple level submenus that height is not enough and that’s why after opening enough sub-menus they will start to overlap.

We’ll update the theme as well, but in the meanwhile add this code to the Additional CSS panel in the Customizer to fix this issue:

.cryout nav#mobile-menu .sub-menu.toggled-on, 
.cryout nav#mobile-menu .children.toggled-on {
    max-height: 3000px;
}

The new 3000px value should make everything work as expected.

Have a great day!

---

Before posting consider reading our short theme debugging instructions.
Please read the FAQs: Mantra • Nirvana • Parabola • Tempera
Tutorials: custom menus • translating theme • installing theme • category page with intro • disabling comments Wordpress: child themes • categories/posts
Before making any modifications to your theme we strongly recommend using Child Themes.

[bassicsax]

Hi Kay. Thank you for this!

Yes, there are a lot of different types of saxophones. To be fair though, my site is one of the largest saxophone sites on the Net. Between this site, and its related blog-style site, there are about 5,000 pages of WP material. FYI, my site goes back to 2008, that’s why it is so content rich.

I ended up increasing to 10,000px and it could maybe even go higher still. Why?

Because if a person browsing the right drop down navigation menu doesn’t close the arrows for the child pages they have already opened up, even at 10,000 they could end up at over-lapping text as they continue browsing child pages further down in the menu.

On an unrelated, but still navigation issue, I updated the theme last night to the new version. I was happy to see that suddenly a navigation menu appeared in the header.

There is a small problem with this though. When an header image is present, the only option for menu position is “Over header image”. If “Normal” is chosen, child pages vanish behind the image.

However, if “Over the header image” is chosen–like I have currently chosen on my site–then some pages are covered up by the Search box and are not visible. Furthermore, the Search box is rendered unusable, because moving the curser over it, in effect hovers over the pages under it.

Website: bassic-sax.info/version5

[Author]

Posts