Editor v4: The future of Elementor in 2025 and beyond

The Evolution of Elementor

Elementor has undergone remarkable transformations since its inception, and I’m truly grateful for discovering this powerful website builder. The journey began in 2016 with the Section and Columns era, offering designers unprecedented freedom to create websites according to their vision using a drag-and-drop builder.

As web development in WordPress evolved, several significant developments influenced Elementor’s trajectory:

• The popularity of cool CSS features like flexbox and grid
• The rising popularity of competitors like Oxygen and Bricks Builder
• The emergence of innovative educators like Oohboi, who shared valuable tutorials and a plugin

These developments enlightened Elementor users, sparking demands for greater creative freedom. In response, Elementor made the bold decision to gradually revamp its builder infrastructure.

The Container Revolution

In March 2022, Elementor version 3.6 introduced the Flexbox Container as an alpha experiment, marking the beginning of a new chapter. This innovation progressed steadily:

• October 2022: Container experiment upgraded to Beta status in version 3.8
• February 2023: Container reached Release Candidate status
• Later in 2023: Grid Container was introduced in version 3.13
• September 2023: Container experiment promoted to Stable status in version 3.16

Today, we’ve entered the version 4 era with atomic elements, starting with Elementor version 3.29.

The Learning Journey: A Cycling Analogy

The evolution of Elementor mirrors a child learning to ride a bicycle:

1. Training Wheels Phase (Sections and Columns): Everything was essentially managed for us—parent sections, inner wrapper div elements, and pre-applied flexbox CSS. Users simply needed to specify percentage widths for inner columns.
2. Stabilisers Off (Container and Nested Elements): With training wheels removed, users gained more freedom to apply CSS flexbox styles and exercise greater control. However, we still relied on numerous wrapper divs to support our designs.
3. Advanced Cycling (Grid Container): As users became comfortable with flexbox, the Grid container added complexity and freedom.
4. Independent Riding (Version 4): Now, the Elementor team believes users are ready to build without aids like hidden CSS styles and wrapper divs. We’ve entered the version 4 era with atomic elements—no wrapper divs, just direct access to root HTML elements.

Direct HTML Access: The Game-Changer

Previously, adding a heading widget meant navigating through two wrapper divs before reaching the actual <h2> element—these wrappers helped with motion effects, margin issues, and other potential challenges. Now we have direct access to the <h2> element itself.

Benefits of Atomic Elements

Atomic elements offer several significant advantages:

1. Cleaner HTML Output: Lighter HTML means more performant websites.
2. Enhanced Maintainability: Global classes and variables enable style reuse. Managing styles—including global colours, typography, and contextual spacing—has become more streamlined.
3. Improved Accessibility: The unified style UI highlights HTML structure, making it easier to identify when a container isn’t properly set as a section. Additionally, custom attributes are added directly to the root element rather than a wrapper div, allowing straightforward implementation of ARIA attributes.

Looking Forward

We can anticipate further enhancements as Elementor builds upon this new infrastructure. However, the success of this product relies heavily on constructive feedback from users. If you notice bugs or potential improvements, please report them on GitHub with detailed information to help the development team.

Let’s continue working together to advance accessibility, WordPress, and web development as a whole!