How to Use Elements to Build Your Web Page

Elements are the building blocks of your webpage. From text, icons, and buttons to images and videos, elements allow you to structure and customize your content. Follow this guide to learn how to use elements effectively.

1. Adding Elements to Your Page

1. Open the sidebar on the left and click on Add Elements.
2. Browse through the categorized elements to find what you need.
3. To add an element, click, hold, and drag it onto your page.
4. Thick gray lines will appear, showing where the element can be placed.
5. Release the element to drop it into the selected area.

For example, dragging a text element onto the page will add it with placeholder text.

2. Moving Elements

• Click and hold the element you want to move.
• Drag it to a new location—blue circles will indicate that it is being repositioned.
• Release it in the desired spot.

3. Editing Elements

Click on an element to bring up the context toolbar, which provides options such as:

• Delete – Remove the element.
• Copy – Duplicate the element.
• Style Options – Adjust padding, margins, animations, and other design settings.

Each element has unique settings based on its type. For example:

• A text element will have font and alignment settings.
• An icon box element will have different styling options.

4. Duplicating and Deleting Elements

• Duplicate: Select the element and click Duplicate from the toolbar.
• Delete: Click the Delete option to remove an element.

You can also right-click on an element to open a context menu with options like copy, duplicate, and delete.

5. Searching for Elements

• If you need a specific element, use the search bar in the Add Elements panel.
• For example, typing "video" will quickly find the Video Element.
• Click, hold, and drag it onto your page.

6. Customizing Your Workspace

To remove unnecessary elements from your panel:

1. Go to Edit in the Add Elements menu.
2. Deselect elements you do not plan to use.
3. Click Done to declutter your workspace.

You can always restore hidden elements later if needed.

By following these steps, you can efficiently add, move, edit, and organize elements to create a well-structured and visually appealing webpage.