# WebPage Editor Toolbar

The Web Page Editor toolbar allow single-click access to common actions such as aligning elements or bringing selected elements to the front. The toolbar actions are also accessible through the Edit menu.

Note:

- The WebPage toolbar can be customized by moving and resizing it.
- Icons will appear grayed out when their corresponding functions are not available in the current context.

WebPage Toolbar
| Undo | Undo the last action.
| Redo | Redo the last action.
| Delete | Deletes the selected elements.
| Cut | Cut the selected elements. Often used in conjunction with Paste.
| Copy | Copy the selected elements or files to the clipboard. Often used in conjunction with Paste.
| Paste | Paste elements that were cut or copied.
| Lock | Toggle lock/ unlock selected elements in place.
| Export | Export the current WebPage as a template.
| Replace Tags | Opens the Replace Tags dialog window. Replaces the tags of a selected control element.
| Equal Horizontal | Aligns equal horizontal spacing between three or more selected elements.
| Equal Vertical | Aligns equal vertical spacing between three or more selected elements.
| Remove Horizontal | Removes horizontal spacing between selected items.
| Remove Vertical | Removes vertical spacing between selected items.
| Equal Sizes | Makes two or more elements equal in size to the first element selected.
| Equal Heights | Makes two or more elements equal in height to the first element selected.
| Equal Widths | Makes two or more elements equal in width to the first element selected.
| Send to Back | Changes Z-Order of an element - sends element to the back.
| Send Backwards | Changes Z-Order of an element - sends element backwards one index position.
| Bring Forward | Changes Z-Order of an element - sends element forward.
| Bring to Front | Changes Z-Order of an element - sends element to the front.
| Group Controls | Groups multiple elements together. Note: When multiple elements are grouped together, their individual element Properties are no longer accessible. Instead, they are replaced by Group Properties, which allows you to specify a name for the Group, and X and Y coordinate values of the grouped elements. To adjust and edit the Properties of individual elements in a Group, first double-click the Group, then select individual elements to adjust their Properties. Press the ESC key to complete the edits. When an element with a published property tag is placed in a Group, the path name of the element changes to include the name of the Group. For example, WebPages.WebPageName.GroupName.SelectionBoxName.Content. For a full list of elements with published properties, see the WebPages Element Property Tags topic.
| Ungroup Controls | Undoes the binding of a Group of elements. Note: When elements with a published property tag are in a Group and are then ungrouped, the element's name will be changed. For example, WebPages.WebPageName.GroupName.SelectionBoxName.Content becomes WebPages.WebPageName.SelectionBoxName.Content
| Align Left | Aligns two or more elements along the left edge.
| Align Right | Aligns two or more elements along the right edge.
| Align Top | Aligns two or more elements along the top edge.
| Align Bottom | Aligns two or more elements along the bottom edge.
| Align Center | Aligns two or more elements along the vertical center line.
| Align Middle | Aligns two or more elements along the horizontal middle line.
| Toggle Grid | Turns on a grid overlay to help with positioning and layout of elements on the page. Note: The Toggle Grid option applies to all WebPage Editor tabs in the IDE. For example, if there are multiple WebPage Editor tabs in the project (WebPage, WebPage1, WebPage2, etc.), when Toggle Grid is activated for one WebPage Editor tab, it will be activated for all of the WebPage Editor tabs.