How to use element groups in website editing
In this tutorial, you'll learn how to use element groups when editing your website.
Note: Grouping elements allows for easier repositioning of multiple components while preserving their relative layout.
Element groups are for editing convenience only. They will not appear on the live site and are not saved when using the "Save" function.
Step 1 - Create Group
To create an element group, hold down the Ctrl key and click on each element you want to include in the group.
Once selected, a solid outline will appear around the grouped elements to indicate the group has been created.
Step 2 - Rearrange Elements Inside Group (Optional)
Within a group, you can rearrange the elements by dragging them into the desired position, as long as the group is not locked.
Step 3 - Lock
To move the entire group as one unit, click the "Lock Group" button.
Note: The group menu will always be positioned to the left of the leftmost element.
If multiple elements share the same left position, it will align with the topmost among them.
Step 4 - Drag & Drop
After locking the group, you can drag and reposition it anywhere within the same section. A "Locked" label will appear in the top-right corner of the group.
Info: Element groups cannot be moved to a different section.Step 5 - Dismantle
To dismantle a group, click the "Dismantle Group" button.
Important: Dismantling a group does not delete the elements—it simply removes the grouping.Next steps
Related Articles
How to add and use an anchor element
In this tutorial, we will guide you on how to add and use an anchor element. Note: This feature is particularly useful for single-page websites or long pages. Step 1 - Open "Add Element" Menu To add a new element to the page, you have two options: 1. ...How to add a new element to the website
You need to think about Aphyo’s templates like a starting point for your website. Even if you have found the aesthetic that you like and matches your brand’s imagery, you still need to make some changes. So here’s how to add a new element to your ...How to edit an element
There are two ways you can edit an element. 1. You can hover the element you want to edit and use the small toolbar that allows you to edit or delete the element. 2. Double click the element to open its editor. We recommend that before you start ...How to customize a website text style
This tutorial will guide you on how to customize a default, custom or button text style. Info regarding font resize When increasing font sizes, Aphyo automatically resizes all elements across the website to maintain the layout. Font size decreases do ...How to edit authentication element styles
In this tutorial, you’ll learn how to customize the styles of the authentication element. Note regarding state: This element can have multiple states, which are controlled from the bottom section of the corresponding editor. The states refer to: ...