Select to view content in your preferred language

Mega Menu Support???

643
3
Jump to solution
11-06-2019 08:19 AM
EricShreve
Frequent Contributor

Does anyone know if ArcGIS Hub supports Mega Menu capabilities? I took a screenshot of an example that I would like to have that was done in Drupal with our emergency bulletin site.

Tags (2)
0 Kudos
1 Solution

Accepted Solutions
KlaraSchmitt
Esri Regular Contributor

Hello Eric,

Out-of-the-box our header and menu selection options do not support mega menus. If you choose the custom header, you may be able to create your own using all CSS. However, we don't have any examples of customers who've done this readily available for reference. I'd recommend searching for Bootstrap 3 mega menu examples and experimenting off those to build a custom header for your site.

-Klara

View solution in original post

3 Replies
KlaraSchmitt
Esri Regular Contributor

Hello Eric,

Out-of-the-box our header and menu selection options do not support mega menus. If you choose the custom header, you may be able to create your own using all CSS. However, we don't have any examples of customers who've done this readily available for reference. I'd recommend searching for Bootstrap 3 mega menu examples and experimenting off those to build a custom header for your site.

-Klara

EricShreve
Frequent Contributor

Klara Schmitt‌ thank you for the clarification. Theoretically you should be able to do this all within the text card to apply the CSS?

0 Kudos
KlaraSchmitt
Esri Regular Contributor

Hi Eric,

Not quite the text card. You can do custom embedded styles within the text card if you want to style other elements of the homepage or stand alone pages, but if you want the mega menu in your Header, you'll want to open Header from the Customize Pane in the Site Editor and choose the Custom HTML/CSS radio from the Appearance accordion. Once you've selected that, you can put your custom header Bootstrap in the HTML block and put the CSS you're using to control the mega menu in the CSS block. The HTML and CSS blocks for the Header will remain scoped to the Header, so you it'll only affect that component.