nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Multiple Sidebars in One App

WorcesterGTSS

I am creating an Experience Builder app that includes a collapsible sidebar on the left side of the map that includes a layer list.

I have also configured a Feature Info widget so that it returns results from a Search widget associated with the map. I would like this Feature Info widget to be in its own collapsible sidebar on the right side of the map but when I implement this, there is a dead zone (where you cannot pan/zoom/click on the map) around this second sidebar and when the sidebar is minimized, the dead zone includes the entire extent of the (maximized) sidebar.

My question is: Is there a way you can you have two sidebars in an app without having this dead zone issue? If not, is there another approach to having a collapsible window of some kind that includes the Feature Info widget?

When two sidebars are added, there is a dead map zone around the 2nd one.

Find more posts tagged with

ArcGIS Online

Accepted answers

Jeff.Thompson@arlingtontx.gov_arlingtontx

I made a bit of an error in that post where I said "First is the always open side. Second is the collapsable side." That is not actually true. The First and Second side actually change based on how the sidebar opens.

In your stacking order, Sidebar 2 is inside the Map. The Map should be inside Sidebar 2 which should be directly under the Second label.

This is how my double sidebar application looks.

All comments

ACharvin

Thank you, Helped me resolve the issue with dead space I was having as well by following the method mentioned.

WorcesterGTSS

This solved the issue - thanks again for your help! It's not an easy task to rearrange those elements but I managed!

WorcesterGTSS

Great, thanks so much for the info. I'll give this a try!

Jeff.Thompson@arlingtontx.gov_arlingtontx

In your stacking order, Sidebar 2 is inside the Map. The Map should be inside Sidebar 2 which should be directly under the Second label.

This is how my double sidebar application looks.

WorcesterGTSS

Hi Jeffrey,

Thanks for that - it definitely helps me to understand why this is happening! However, I'm still struggling with the order the elements should be in. The second sidebar is actually nested within the first one already. Right now it is under Sidebar/Second/Map. Any advice on how they should be re-ordered? Should it be under "First" where the elements of the left sidebar are? I haven't mastered the trick to actually performing the re-order of the elements too. It seems a bit tricky. Thanks again.

Jeff.Thompson@arlingtontx.gov_arlingtontx

https://community.esri.com/t5/experience-builder-tips-and-tricks/the-sidebar-problem-or-why-can-t-i-click-on-part/ba-p/1343521

Here's a post on dealing with this sidebar issue. I have thought about extending this piece to deal with the double sidebar problem, but the short version of it is you just do the trick again and stuff the first sidebar into the second sidebar.

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.