Change the order of elements or arrange them next to each other

The position of each element in your app can be changed in the "Pages & Elements" editor. In addition to vertical positioning, you can use the "Pages & Elements" editor to group cells and merge them in one row. This option may be useful for Apps containing many elements. By grouping your cells your app is more compact and easier to use.

You can change the arrangement of your elements or group elements within your app in the Web Portal by clicking on "Rearrange, style, and elements" icon.

Overview:

• Change the order of elements
• Group elements
• Add new page

Change the order of elements

Each placeholder box represents the corresponding element of your app (for example a cell from your spreadsheet or a chart). You can move each box around using drag & drop.

To change the position of an element, proceed as follows:

1. Open your app in the Web Portal.
2. Click on "Rearrange, style, and elements" icon.
3. Grab the desired box on the dotted icon. (Drag)
4. Move the box to the desired location.
5. Release the left mouse button. (Drop)

A green line indicates you where the element will be placed if you release the left mouse button.

Group elements

In order to place two (or more) elements in one row you must group them together.

To group elements, proceed as follows:

1. Open your app in the Web Portal.
2. Click on "Rearrange, style, and elements" icon.
3. Grab the desired box on the dotted icon. (Drag)
4. Move the box into the element with which you want to create a group.
5. Release the left mouse button. (Drop)

To ungroup elements simply drag a box and drop it outside of the group.

In the screenshot above we are currently in the process of grouping the elements "Maturity Value" and "Yield". Basically, you drop one element into the other. This is symbolized with a green frame around the element and causes a side by side arrangement.

Add new page

You can add an extra page to your app and fill it with elements. For example if there are lots of charts create a separate dashboard page within your app.

To add a page, proceed as follows:

1. Open your app in the Web Portal.
2. Click on "Rearrange, style, and elements" icon.
3. Click "+ New Page" in the top row.

For more information about adding pages, please view this article: https://support.openasapp.net/hc/en-us/articles/208672309