Elementor uses the term “Container” to represent both parent containers and child containers (think of these as rows and columns). Originally, Elementor used the terms “Section” and “Column”. Also, the current term for the popup layer panel is “Structure”, whereas originally, it was called “Navigator”. If your site is older, it will use the original terms.
Working with Containers
On Elementor pages, content is laid out in “Containers”, which can be divided into child containers. Think of the parent containers as rows and the child containers as columns. You place Elements (aka widgets) inside containers.
Note: older versions of Elementor have “Sections” instead of parent containers.
Child Containers
If you want to group multiple elements in “columns”, create child containers within the parent container. For example, you can stack a Heading, Text Editor, and Button inside a child container.
Note: older versions of Elementor labeled child containers as “Columns”.
Structure Panel
To view the Structure panel, either click the stacking layers icon in the top right (next to the search icon) or right-click anywhere on the page where there is content (but not within the header or footer) and click “Structure” (or “Navigator”) on the popup menu. If you click on a container or element on the “Structure” panel, it will be automatically selected on the page.
Because Elementor labels all containers (both parent and children) as “Container”, it is helpful to rename the parent containers on the Structure panel. Double-click on the container name to change it.
Select an Existing Container
To select a container or element, mouse over the container or element until the pink border shows. Parent containers (or sections) are marked with a pink border and pink tab. Child containers (or columns) are marked with a pink border and a gray square in the upper left corner. Elements are marked with a pink border and a pink pencil icon in the upper right corner.
Once a container is selected, design options for that container are displayed in the left-side design panel.
Add a New Parent Container
Here are the ways to add a new parent container. If you want to add a new container on a blank Elementor page, click the gray Plus (+) sign in the page content area. Then click “Flexbox” and select your container structure. Note: if you don’t plan on dividing your content into columns (child containers), choose one of the arrowed structures.
If you want to add a new container in between two existing containers on a page, mouse over the bottom container and click the Plus (+) icon on the pink tab at the top of that container. Now click the gray Plus (+) icon, then Flexbox, and then your desired container structure.
If you want to duplicate an existing container on the page (useful if you want another container with the same layout), mouse over the pink tab at the top of the existing container and right-click. Then select “Duplicate” from the popup menu. This will create a complete copy below the existing container.
