SOLVED: Wordpress Mega Menu - Template Styles Missing from Template Selected for Mega Menu Dropdown

[daviddemastus]

Using Bricks 1.8

I am using the option to enable the Mega Menu toggle in the standard Nav element, then selecting a template to use as the Mega Menu via the Wordpress Menu options.

It seems to select and display my template when I hover on the menu element, but none of the styles that have been applied to that template are being loaded.

Template I created:

Mega Menu Toggle Enabled in Nav Element:

Bricks Template selected in Wordpress Menu options:

Result on frontend when hovering over assigned menu item:

I even inspected the page to see if any of my styles where being overridden, but they are simply not in the computed styles at all.

I tried switching to Inline CSS, then back to External CSS and clearing CSS cache.

I don’t have any cacheing plugins enabled.

Do I have to design the template via the menu instead of directly via my template?

[daviddemastus]

I tested with the Nav (Nestable) element, and inserted the mega menu template I created inside the placeholder dropdown. The styles work fine here.

[daviddemastus]

Another thing I discovered accidentally is that the Wordpress megamenu option will work as long as I have the Nav (Nestable) element in my header with the mega menu setup, but hidden via display:none;

It must be loading the missing styling for the template.

[aslotta]

Hey David,

thanks for your report.

Can you please send some temporary credentials to your site to help@bricksbuilder.io from the email address you used when purchasing Bricks? Please also include a link to this forum thread and let me know where exactly (page / template) I can find the problematic nav menu element.

Best,

André

[daviddemastus]

Hi @aslotta, thanks for checking it out. Just sent.

[aslotta]

Hey David,

thanks for the credentials.

I was able to reproduce the issue and added it to our bug tracker. Can you confirm that everything works as expected when you add the styles on the ID level instead of using classes?

Best,

André

[manc]

Just ran into the same issue and transferring styles onto the ID seems to work.

In my case, I had some elements styled via global classes on the homepage. I reused some of those elements with their classes in the mega menu. That lead to the elements in the mega menu to display correctly on the homepage but not on any other page.

So basically it seems not to load the css which loads on the page causing it to loose the styling.

Just for clarification in case it helps narrow down the issue

[aslotta]

Hey @daviddemastus,

we applied a potential fix to your site. Can you give a quick feedback if it now works for you as expected?

Thanks,

André

[timmse]

Hi David,
We’ve fixed this bug in Bricks 1.8.1, now available as a one-click update in your WordPress Dashboard.

Please let us know if you are still experiencing issues.

Best regards,
timmse

[pagelab]

I’m still experiencing the issue with the Nav element in version 1.9.5.

The issue is solved when styles are added at the ID level.

[timmse]

Hi @pagelab ,
Welcome to the forum!

Can you please provide more details in the form of a live link and a short screencast showing and explaining your setup and the issue?

[pagelab]

Hi @timmse,

I’ve sent you a private message with the credentials to access the website where the issue occurs.

It’s a vanilla WordPress install, with only Bricks + Bricks Child activated.

I simply created a mega menu template with some elements in it.

Then, I created a header template, including in it a Nav element with this mega menu template, which was previously set in Appearance > Menus.

All styles were applied at the class level to the mega menu template.

Editor view:

Front-end view:

[timmse]

Hi @pagelab ,
Thanks for the credentials! I can see and replicate the issue and added it to the bug tracker.

In general, it would’ve been better to create a separate report for this issue, since this report is relatively old and applies to the front-end, not the canvas (as far as I can see).

Anyway, recorded in the bug tracker

[pagelab]

applies to the front-end, not the canvas

No, It IS applied to the canvas, but only while editing the template. It’s not a separate bug.

It would’ve been better to create a separate report for this issue

You may want to change this then:

@thomas

Make sure to use the search functionality first and comment on already existing bug reports rather than creating duplicate bug reports.

[timmse]

Hey guys,
We have just looked at this again but can no longer reproduce it. It seems that the problem has already been solved. Can you please check again with the current Bricks version (1.9.9)?