Add and remove elements

Adding elements involves introducing new components such as text, images, buttons, or forms onto a page. Removing elements covers deleting existing content from the page.

In this section, we’ll explore adding and removing elements on a page, best practices, and the impact they have on the overall user experience.

Learn more about the elements available in the application builder.

Overview

In application design, integrating various elements onto a single page enhances user experience and navigation efficiency. By combining forms, buttons, text fields, images, and interactive features, you create cohesive interfaces.

It’s important to maintain clarity and organization to prevent clutter and confusion for users.

Add an element to a page

Adding elements enhances the structure and content of a page, offering flexibility and customization options.

To add an element to a page, follow these steps:

  1. Open the page and click Elements.

  2. Click Element + located in the lower left portion of the popup. Alternatively, click on the plus icon + on the page to add an element.

    Add elements to a page

  3. A menu of available element options will appear. Select from the available options or use the search box to find a specific element by name.

    List of application builder elements

  4. Once you’ve chosen the element you want to add, click on it.

After selecting the element, you can place it anywhere on the layout of the page. Don’t worry too much about perfect positioning at this stage; you can always adjust it later as needed.

Duplicate element

Duplicating an element creates an identical copy of it, usually positioned right below the original.

This provides multiple instances of the same element without the need to recreate it from scratch.

You can navigate and build with Baserow’s Application Builder using only your keyboard. Use keyboard shortcuts for quick actions.

To duplicate an element:

  1. Hover over the element you want to duplicate.
  2. Locate and click the double square icon.

This action creates a duplicate of the selected element within the application, giving you the freedom to tweak and adjust the duplicated version without altering the original.

Duplicate element

Remove element from a page

To remove the element from the page, follow these steps:

  1. Locate the trash icon associated with the element you wish to delete.
  2. Click on the trash icon to initiate the deletion process.
  3. Confirm the deletion if prompted.

We advise that you proceed with this action only if you are certain you no longer need the element.

Remove elements from a page

Still need help? If you’re looking for something else, please feel free to make recommendations or ask us questions—we’re ready to assist you.