HOW TO

Adjust the size of the Menu widget modal window in ArcGIS Experience Builder

Last Published: February 8, 2024

Summary

In ArcGIS Experience Builder, when configuring the icon type in the Menu widget, a modal window is displayed. Ensuring the modal window is more compact prevents it from occupying excessive space or covering other information in the web experience. However, it is important to note that there is no direct option in the Menu widget settings to change the size of the modal window in ArcGIS Experience Builder.

The image of the default modal window being displayed after clicking the Menu widget

This article provides an example and instructions using the Widget Controller widget or anchored window to customize the desired size of the web experience modal window.

Procedure

Use the Widget Controller widget

  1. In ArcGIS Experience Builder, open the created web experience.
  2. On the Insert widget panel, drag and drop the Widget Controller widget to a desired position on the canvas.
  3. Drag and drop a new Menu widget to the existing Widget Controller widget.
  4. On the Menu panel, for Type, select Vertical. Configure other Menu settings.
The image of the Vertical option is being selected for Type on the Menu panel
  1. Click the existing Widget Controller widget to open the Widget Controller panel.
  2. Under Widget panel arrangement, select Floating to set the widget panels to appear floating next to the controller, anchored to the widget's icon. Select Fixed to fix the widget panels to appear at one of nine anchor points on the canvas.
Note:
Skip Step 7 if the Floating option is selected in Step 6.
  1. Under Position & size, adjust the panel width and height by typing the percentage values (%) or the pixels (px) for W and H. In this example, 10.00% and 35.00% are set for W and H. Alternatively, resize the widget panel on the canvas.
The image of the widget panel which can be resized on the canvas or on the Widget Controller panel
  1. Configure other necessary settings.
  2. Repeat Steps 2 through 8 on other pages. Click Save > Publish.

The map shows the compact widget panel displayed after clicking the Menu widget.

The image of the compact widget panel displays after clicking the Menu widget

Use the anchored window

  1. In ArcGIS Experience Builder, open the created web experience.
  2. Click the Page icon > Window > Add window > Blank window.
The image of a blank window being added to the web experience
  1. Click the Insert icon. Drag and drop the Menu widget into the newly created window.
  2. On the Menu panel, for Type, select Vertical. Configure other Menu settings.
  3. Click the new window to open the Window panel.
  4. On the Window panel, for Mode, select Anchored.
  5. Under Size, edit the desired size for W and H. Alternatively, resize the window on the canvas.
The image of the window being resized on the canvas
  1. Under Close options, check the Click outside to close Window check box.
  2. Navigate to the main page and drag and drop the Button widget from the Insert widget panel to a desired position on the canvas.
  3. On the Button panel, configure the following settings.
    1. Click Set link, under Link to, select Window from the drop-down menu. For Select a window, select Window from the drop-down menu. Click OK.
    The image of the Window option is being selected to be linked to the Button widget
    1. Edit the Tooltip, Text and Icon sections as required.
    2. Toggle the Advanced option on to configure other settings.
  4. Repeat Steps 9 through 10 to add the Button widget to the other pages. Click Save > Publish.

The map shows the compact anchored window displayed after clicking the Menu button.

The image of the compact anchored window displays after clicking the Menu button

Article ID: 000031892

Software:
  • ArcGIS Experience Builder

Receive notifications and find solutions for new or common issues

Get summarized answers and video solutions from our new AI chatbot.

Download the Esri Support App

Related Information

Discover more on this topic

Get help from ArcGIS experts

Contact technical support

Download the Esri Support App

Go to download options