Pro MegaMenu

Hi there,

What do you mean by specific mobile breakpoints? You mean create mega-menu from scratch? The existing one is not yet integrated into Pro header, your only options, for now, is create it from scratch or use Ubermenu.

Unfortunately, we can’t help you create it from scratch with different breakpoints.

Thanks!

Hey Rad,

Main reason I bought Pro was the header builder and the mega menu; was devastated to learn they didn’t work together.

I’ve been waiting a few months for this feature so I can set my new site live - updated to the latest version this morning and still nothing.

Could you give an update on when this will be integrated?

Really excited, as this will make Pro my go-to theme…

Cheers,

Hi @Gungurru,

Thanks for writing around! We don’t have a date yet but rest assured that this has been noted down and we are working to address it as quickly as possible, but we have some other items in the “pipeline” for the time being.

Thank you for understanding.

I have a work around for this:

  1. Create your Uber Menu as normal
  2. Generate the shortcode here: Appearance > UberMenu > Manual Integration > Integrate Specific Menu (Choose your menu)
  3. Copy the shortcode and go to your pro header editor (should look like this: [ubermenu config_id=“main” menu=“2”])
  4. In place of your inline navigation (and your collapsed as well really as Uber handles its own responsive behaviors), create a Content Area item and paste your shortcode there
  5. Your UberMenu is now simply an element in the Pro Header builder. Mange the menu design/structure/content as normal.

So far, this is working for me just fine. However, there should really be more of a native integration to simplify this workflow.

Thanks all!

Hi,

Thank for sharing a workaround.

Have a nice day! :slight_smile:

Hi!

I don’t know if this helps but I was trying some tweaking and was able to get this:
http://www.realperitos.com/novosite
(it’s still in early stage of production)

Here’s the custom CSS I used:

/****** MEGAMENU ******/
@media only screen and (min-width: 980px) {
  .menu-item-has-children { position: inherit; }
	.menu-item-has-children>ul { width: 100% !important; }
	.menu-item-has-children>ul>li {
	  width: 25% !important;
	  float: left !important;
	}
}

Apart from this, just applied some padding and styling to sublinks. Still have to custom it a bit more.

It’s not the perfect solution but until Megamenu comes to Pro, it works! :slight_smile:

1 Like

@Ricarditu

Thanks for sharing!

Hi @Ricarditu

I hope you dont mind but can i ask what you used to do the logo carousel at the bottom of the your page: http://www.realperitos.com/novosite/ ?

Its where they go full width and change to colour on hover. Its exactly what i am after for a project that i am working on.

Thanks.

Hi @King,

I believe he is using : https://wordpress.org/plugins/wp-logo-showcase-responsive-slider-slider/

But maybe he can confirm you if you send a message to him directly.

Thanks

Hi @King!

Sure, no problem. I’m using a premium plugin called “Logos Showcase - Multi-Use Responsive WP Plugin”, available on Codecanyon:

The one @Joao mentioned might work as well, I don’t know because I never used it but being free, just give it a try! :wink:

Thanks!

Hey There,

Thanks for confirming the plugin installed.

Regards.

Thanks for your help guys. @Ricarditu @RueNel Much appreciated :slight_smile:

1 Like

If you need anything else please let us know.

@ Ricarditu - Many thanks to you! :relieved:

Glad to hear that. :slight_smile:

Hey, is there a reason why I can’t see this link? I’d really like to know the solution.

Hello @bobbybosler,

You can add following CSS under Pro > Theme Options > CSS:

@media only screen and (min-width: 980px) {
.menu-item-has-children {
position: inherit;
}
.menu-item-has-children> ul {
width: 100% !important;
}
.menu-item-has-children> ul> li {
width: 50% !important;
float: left !important;
}
}

Please note that this is a quite old thread. If you have further questions, please create a new ticket and share the details in the same. As posting in a ticket started by a different user create lot of confusion and slows the response time.

If you would like to learn CSS, I am sharing few resources that you take a look to get started with CSS and an interesting tool that you can use to speed up the development process.

I recommend you to watch following video that will help you to get started with CSS.

https://www.youtube.com/watch?v=MFR4WXiLzpc

Sometimes it can get a bit difficult to find out the right selector to be able to write the required CSS codes. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

https://www.youtube.com/watch?v=tP_kXBJWPhQ&t=200s

Thanks.

Thanks @Prasant. I’m pretty proficient in CSS, so the “getting started with CSS” videos aren’t really necessary. I had to go Ubermenu, which is actually pretty great!

On behalf of my colleague, you’re welcome. Cheers! :slight_smile:

@bobbybosler - Hello! BTW here is the updated link:

:slightly_smiling_face: