✅ 🔥 Elementor v3.29 Beta Release 🔥

[avivu]

===========

Beta Version Updates - Please Read Below!

===========

 

Hey Beta testers, 👋

We're thrilled to announce that Elementor 3.29 Beta is now live, marking a significant milestone in Elementor's evolution! This release introduces the first alpha version of Editor V4, a completely reimagined approach to Elementor's Editor that lays the foundation for a faster, more modern, scalable, and efficient website building experience. We're also excited to unveil Cloud Templates, a powerful new Pro feature that lets you save and reuse templates across sites.

Make an impact by testing Elementor 3.29 beta and sharing your impressions on these groundbreaking additions:

• Editor V4 Alpha - Our next-generation Editor architecture with CSS-first styling
• [Pro] Cloud Templates library - Save and reuse design Elements across multiple projects
• & more!

Looking forward to your thoughts and feedback on this exciting update!

 

Introducing the first Editor V4 Alpha release

Elementor 3.29 introduces Editor V4 Alpha, marking the beginning of a major evolution in the Editor’s infrastructure. This version allows you to experience these updates firsthand and help shape its future through your feedback.

The guiding principles for developing Editor V4 are:

• Improved performance - Lighter DOM and fewer div wrappers for better speed and more optimized websites
• Atomic design system - A modular approach that makes designs more maintainable and efficient
• CSS-oriented design - A shift toward better-structured styles for more predictable design workflows with features like Classes and States
• Future-ready infrastructure - Setting the groundwork for improved performance, maintainability, and extensibility

 

Opt-in to explore Editor V4 at any time

 

Editor V4 Alpha is available for you to opt-in to and explore, while keeping the existing V3 functionality intact. Please keep in mind that this is an early alpha version and should not be used on production sites. To activate Editor V4 Alpha features:

1. Update to version 3.29
2. Go to WordPress > Elementor > Settings > Editor V4
3. Click "Activate"
4. Return to the same page to opt-out if needed

Container, Nested Elements, and Top Bar will automatically activate along with Editor V4 features. If you decide to opt out, V4 features will be disabled and any content created with its components will be removed from the site.

 

Use familiar V3 widgets alongside new Editor V4 features

Editor V4 works seamlessly alongside V3, ensuring a smooth transition and allowing you to continue using familiar V3 widgets and new V4 elements on the same page and in the same layout. However, you won’t be able to apply the new V4 styling features, including Classes and States, on V3 widgets.

For optimal results, Editor V4 is designed to run with the Hello Theme and Hello Biz. Other themes may not fully support all V4 features or styling behaviors.

 

Work faster with cleaner code and fewer div wrappers

 

We've always worked to balance new features with performance optimization. But now, as we rebuild the Editor from the ground up, we’re able to reevaluate our approach towards performance and improve it fundamentally.

Editor V4 introduces lighter DOM and less divs, with each element using a single div wrapper (compared to multiple nested divs in previous versions), resulting in cleaner code and faster rendering.

A more prominent performance shift will come in later releases and will be especially impactful when adopting V4 exclusively, but you will already notice an improvement with this version.

 

Create reusable style collections with Classes and States

Classes are labels assigned to HTML elements to apply specific styles. Think of it like creating a style preset that contains multiple visual properties like colors, fonts, spacing, and more. Instead of styling each element individually (which becomes challenging as your site grows), Classes allow you to create reusable style collections that can be applied to multiple elements, that can also be easily updated site-wide.

Moving away from widget-specific styling, Editor V4 establishes a unified system where all elements share the same design logic and global styling rules. This shift focuses on class-based CSS output instead of inline styles, and a system that aligns with how CSS natively works—including principles like inheritance, specificity, and cascade priority.

In this version, Classes will only be available to admins, however this will expand in the future.

 

Local Class

The Local Class serves as the basis for the new class architecture. It is the strongest in hierarchy and can not be removed. The main features include:

• Visual representation - Each element automatically receives a unique Local Class that appears as a pink label in the Style tab, to visually distinguish it from Global Classes
• Priority - The Local Class will always have the highest priority, and take precedence over any other Global Classes applied to the element
• Fixed identity - Unlike other classes, the Local Class cannot be deleted or renamed—it serves as a permanent identifier for the element's unique styles
• Backend integration - While V3 generated Local Classes in the backend, Editor V4 brings this process to the frontend, making it explicit that you're always editing a specific class

 

Global Classes

 

Global Classes complement the Local Class system by allowing you to apply consistent styling across multiple elements throughout your website. When you create and apply Global Classes, you establish a foundation for design consistency that makes large-scale updates significantly easier.

For example, rather than setting the same blue background, white text, and rounded corners on every button individually, you can create a "primary-btn" class that includes all these properties. Then, you can apply this class to any element that should share this appearance. If you later decide to change style properties, such as the background color, you only need to change it in one place, and all elements on your site using that class will update automatically.

The styling system follows a clear priority hierarchy, with the Local Class having the highest priority, followed by Global Classes in the order they were created.

One of the key benefits of the Global Class approach is that it preserves your work. When you remove a class from an element, it only detaches the class from that specific element, without removing the class from your system. This allows you to reuse classes whenever needed without having to recreate them.

How to Test It:

1. Go to the Style Tab of any element and locate the Classes field.
2. Type the name of the class you want to create or apply.
3. The system will suggest creating a new class or choosing an existing one.
4. Select or create the class. Once applied, it becomes active (highlighted in green), and any style changes will affect all elements using that class.
5. You can apply multiple classes to a single element.
6. Click the three-dot menu on a class tag to rename or remove the class from the element.

 

States

 

States (Pseudo-Classes) bring powerful interaction styling to Classes. This feature allows you to define how elements look when visitors interact with them—creating hover, focus, and active states that enhance visitor experience and provide visual feedback.

Applying a state to a class allows you to make changes that appear in that particular state. This isolation means changes to one state won't affect others, allowing you to craft precise interactive experiences. The system also supports multiple states for a single class, without overwriting each other—preserving the integrity of your design across all interaction scenarios.

To apply a state, click on the three-dot menu of a class in the Style panel and select the desired state to edit. The class will visually indicate what state is being edited, helping you keep track of your work as you build complex interactive elements.

How to Test It:

1. Go to the Style tab and locate the Classes field of the element.
2. Click the three-dot menu next to the class you want to add a state to.
3. Select "State" and choose the desired state:
   • Hover – when the user hovers over the element
   • Focus – when the element gains input focus (e.g., form fields)
   • Active – when the element is being clicked or selected
4. Once selected, the class tag will update visually to reflect the state you're editing.
5. Modify the style settings in the Style Tab — all changes will now apply only to the selected state.
6. Repeat for any other states you want to define.
7. Switch back to the default state when finished editing to continue general styling.
8. Verify that everything works as expected in both the Editor and the frontend.

 

Class Manager

The Class Manager provides centralized control over your Global Classes, allowing you to maintain consistency and manage class priority across your site.

From the Class Manager, delete or rename a class, or change its priority by dragging it to the desired position on the list—the higher the class is on the list, the higher priority it will have. Modifications made in the Class Manager take effect immediately across the entire site.

How to Test It:

1. Class priority is determined by the order set in the Class Manager.
2. Click the Class Manager icon to open it.
3. In the Class Manager, reorder the classes to change their priority — the higher a class appears, the higher its priority.
4. Use the three-dot menu in the Class Manager to rename or permanently delete a class.
5. Verify the class styles work correctly in both the Editor and on the frontend, including when changing class priority.

 

Class indicators

 

This version introduces color-coded indicators that provide instant visual feedback on style properties, enabling you to understand how styles cascade and are inherited. Small colored dots appear next to each modified style property, and update in real-time as you make changes, indicating where styles originate from and if any conflicts exist.

• Pink dots - mark style properties active from the Local Class
• Green dots - mark styles properties active from the Global Class
• Orange dots - signal conflicting styles that may require your attention
• Gray dots - indicate properties inherited from another class, which you can override with local or global style changes

 

Control every single style property responsively per device

 

Editor V4 transforms responsive design with a comprehensive approach to device-specific styling. In V3, only specific style controls could be adjusted per device, identified by a small responsive icon next to the property. Editor V4 removes these icons because now every style control can be adjusted independently for each device—100% of style properties—no coding required.

This also streamlines your responsive workflow and means the editing panel is less cluttered.

To work with responsive styling in Editor V4, switch between devices using the Top Bar device selector or the keyboard shortcut (CTRL/⌘ + Shift + M). Changes you make while a specific device is selected will only affect that device's CSS, giving you precise control over how your designs appear across different screen sizes.

 

Leverage V4’s powerful features with 7 new Atomic Elements

This methodology breaks down Elements into smaller, independent Atomic Elements rather than the monolithic widgets of V3 that contain multiple settings in a single place. Each atom follows a modular system with shared styles and global settings applied consistently across all instances.

While more Elements will follow in later releases, this version introduces DIV Block, Flexbox, Heading, Paragraph, Image, Button, and SVG.

Each of these seven Elements demonstrates the V4 philosophy—simpler markup, consistent styling patterns, and improved performance. This modular approach ensures faster and more scalable design updates across your entire site.

 

Maintain consistent workflows with the unified Style Tab

 

Editor V4 introduces a unified styling approach where all elements share a consistent Style Tab structure. The new Style Tab focuses exclusively on CSS-based styling, enabling advanced features like responsive support, States, Classes and more.

In V3, each widget had a different style structure, which led to inconsistencies and a steeper learning curve. Editor V4 eliminates this issue by ensuring that all new Editor V4 Elements share the same consistent Style Tab structure; content and functionality settings remain in the General Tab, while all visual styling options are housed in the Style Tab, creating a clean separation that streamlines the design process.

 

Comprehensive styling sections

The unified Style Tab includes sections that give you complete control over your elements' appearance.

• Layout - Define the display behavior of elements, and choose between different display settings to control structure and positioning.
• Spacing - Set margins and padding with linked controls that can be unlinked for individual side adjustments.
• Size - Define precise width and height with minimum/maximum constraints and manage overflow behavior.
• Position - Choose from static, relative, absolute, fixed, or sticky positioning with Z-Index control for all non-static positions.
• Typography - Access essential text styling options with additional controls available under the Show More panel.
• Background - Create rich, layered designs with unlimited potential, expanding V3's two-overlay option. Start with a base background, and add multiple overlays by clicking the plus icon.
• Border - Apply consistent or varied border radius to corners and customize borders with precise width, color, and style controls.
• Effects - Leverage the new box shadow controls to create multiple shadow layers to elements with independent controls for each, significantly expanding beyond V3's single shadow control.

 

Style Repeaters

Editor V4 introduces Style Repeaters, which enable you to create layered structures for backgrounds and effects. Currently, Style Repeaters are available for background images and box shadows, with plans to expand to more styling options where layering is beneficial.

The system follows a top-first approach, where new layers are added to the top of the stack. You can reorder layers by dragging them to change their priority, giving you complete control over the visual hierarchy of your design elements. When working with layers, you have several contextual actions available. Hovering over a layer reveals options to duplicate the layer, hide the layer, or delete the layer.

Pro tip: The hide action is particularly useful for testing alternative designs without losing your original work.

 

Actions floating bar

Unlike V3, where action buttons were always visible and could create visual clutter, the floating bar in Editor V4 appears only when you hover over a control. This context-aware approach ensures that you only see the actions relevant to what you're currently working on.

In the initial alpha release, the floating bar supports Dynamic Tags, with plans to add Variables and AI-powered actions in future updates.

 

Link control

Link control transforms elements into interactive links with advanced configuration options. Available in the General Tab of V4 Elements, this feature is activated by clicking on the plus icon, which reveals the link input field.

You have several ways to define links: typing URLs manually, selecting from autocomplete suggestions for internal content, or using Dynamic Tags. You can also control how the link operates, such as toggling whether it should open in a new window. Each element type has specific behavior when a link is applied, ensuring a valid and clean HTML structure.

This feature also prevents nested links, which would create invalid HTML. If a parent container has a link, you'll be prevented from adding links to child elements (and vice versa). When you remove a link by clicking the minus icon, the element's default markup is restored.

 

Logical Properties

As a builder within the WordPress ecosystem, Editor V4 adopts logical CSS properties to better serve global audiences. These properties define styling relative to the content's writing direction, rather than physical direction, ensuring that content translated into different languages renders as intended.

This approach improves how your designs function across different languages, eliminates the need to create separate styles for RTL layouts, and ensures a consistent experience for all visitors–regardless of their language preference.

 

Embark on the journey to Editor V4

 

As Editor V4 continues to grow and improve over time, this early version allows you to begin exploring its capabilities and prepare for the exciting developments ahead, as well as provide feedback to help shape its future.

Important: This early version is specifically designed for exploration and feedback in controlled test environments. As with any alpha release, you may encounter bugs or incomplete features as we continue development.

To start testing Editor V4:

1. Create a staging or test site
2. Navigate to WordPress > Elementor > Settings > Editor V4
3. Click "Activate" to enable V4 features
4. Explore the new Elements and styling system
5. Document any issues or insights you encounter
6. Share your feedback on GitHub!

Remember that Editor V4 is designed to coexist with V3, giving you complete freedom to transition at your own pace. We strongly encourage you to experiment with V4 features in your test environments and share your detailed feedback on GitHub. Your real-world testing and suggestions are invaluable as we refine and enhance the V4 experience.

 

[Pro] Manage a library accessible from multiple sites with Cloud Templates

 

Version 3.29 also introduces the Cloud Templates library, a powerful new Pro feature that transforms how you work across multiple sites. Unlike Site Templates (previously “My Templates”) that are confined to the single website you saved it to, Cloud Templates allow you to build a personal design library that's accessible from multiple sites.

The Cloud Templates feature is currently in beta status and active by default for all sites using version 3.29. As part of the new Cloud Templates feature, we renamed “My Templates" to "Templates" and all local templates that were under “My Templates” are now under “Site Templates”.

 

Access your templates anywhere

The Cloud Templates Library empowers you to save and manage design Elements across all your projects. This feature is associated and connected to your Elementor Pro account and can be accessed across other websites on your account. With Cloud Templates, you can save sections, containers, and other design elements along with their complete content and styles. Create templates once and reuse them anywhere, maintaining perfect consistency.

 

Organize your library

The Cloud Templates library includes organization features that let you sort templates into folders, making it easy to maintain structure even as your library grows. Efficient bulk actions allow you to select multiple templates at once to delete, copy, or move between folders and libraries. Whether you're building a personal template collection or creating a design system for all your websites, these organizational features help keep everything accessible, logical, and well-maintained over time.

 

Seamlessly migrate from your Site Library to the cloud

The Cloud Templates Library integrates smoothly with your existing workflow, allowing for effortless transition between Site Templates and Cloud Templates. You can easily move templates from site-specific storage to your global Cloud Templates, preserving all your previous work, while making it accessible across all your projects.

When browsing through your Site Templates, you'll find a new option to transfer them to your Cloud Templates library (also in bulk!) with just a click. This allows you to quickly build up your cloud collection using the design assets you've already perfected, transforming site-specific resources into a portable design system you can use anywhere.

How to Test It:

1. Open any Elementor Pro site or connect to any Elementor Pro account (with a valid Pro subscription).
2. Save any section or container as a template by right-clicking it and choosing from the context menu, or use the dropdown at the top right (next to the Publish button) to save your entire page as a template.
3. In the modal that opens, save the template to Cloud Templates.
4. Once approved, make sure you see the new template in the Cloud Templates library.
5. Open any other Elementor website this user has access to, (make sure you’re connected) and open the Elementor Library → Cloud Templates.
6. You can see all of the templates that were saved to this user’s Cloud Templates from any other site.
7. For easy onboarding to the Cloud Templates we’ve allowed several ways to quickly access all your previously saved templates. By using the Import feature when inside the Cloud Templates you can mport a single template json file or multiple templates compressed to a zip. Alternatively, you can bulk move/copy from any Site Templates library and into your Cloud Templates to be accessed from anywhere.
8. Once you have everything in place, you can now create folders within the Cloud Templates library and organize them using the bulk move or copy. You can use folders to indicate template types, categories, functionalities, different clients, etc.
9. Once you are ready to reuse and insert templates you can try the new grid view (next to the search bar in Cloud Templates) to get a visual representation of all of the templates you’ve added to your cloud.

 

Design more accessible websites

Elementor 3.29 introduces several accessibility improvements that make your websites more inclusive and compliant with web accessibility best practices:

• Improved Accessibility Tree - Shape Dividers no longer appear in the Accessibility Tree, preventing confusion for screen reader users. Video Playlist Elements are now properly grouped for easier navigation.
• Progress Bar enhancements: - A new "Display Title" control allows you to add screen reader-accessible titles without affecting visual design, providing context for visitors with visual impairments.
• Enhanced role attributes - The Social Icons and Share Buttons widgets now have proper list semantics for screen readers, improving navigation and comprehension.

---

More Improvements

Free version

• New: Introduced the first Alpha release of the next-generation Editor - a faster, modular, CSS-based infrastructure available as an opt-in experience [Editor V4 Alpha]
• New: Combine familiar and new Editor elements for a seamless editing experience [Editor V4 Alpha]
• New: Introduced cleaner code and fewer div wrappers for faster performance and a lighter editing experience [Editor V4 Alpha]
• New: Gain full responsive control - adjust every style property individually for each device, without limitations [Editor V4 Alpha]
• New: Introduced Classes - a reusable styling system that brings consistency, modularity, and CSS-based workflows to your designs [Editor V4 Alpha]
• New: Introduced Class Manager - centrally manage, rename, reorder, and delete Classes across your site [Editor V4 Alpha]
• New: Introduced States - define hover, focus, and active styles for Classes to create dynamic, interactive designs [Editor V4 Alpha]
• New: Introduced Local Class - a fixed, non-removable class with highest styling priority, ensuring unique styling for each element [Editor V4 Alpha]
• New: Introduced Class Indicators - color-coded visual cues that show where styles originate, inherit, or conflict [Editor V4 Alpha]
• New: Introduced a unified Style Tab - a consistent, CSS-based styling system shared across all elements, streamlining design workflows [Editor V4 Alpha]
• New: Introduced Style Repeaters - create and manage multiple background and box shadow layers with full control over their order and visibility [Editor V4 Alpha]
• New: Introduced Actions Floating Bar - a cleaner, context-aware toolbar that appears on hover, starting with Dynamic Tags support [Editor V4 Alpha]
• New: Introduced Link Control - add and customize links across elements with clean HTML, while preventing nested links [Editor V4 Alpha]
• New: Introduced Logical Properties - styling adapts automatically to different writing directions for global language support [Editor V4 Alpha]
• New: Added DIV Block element - a container element for structuring layouts with customizable display options [Editor V4 Alpha]
• New: Added Flexbox element - a layout element for precise alignment and distribution [Editor V4 Alpha]
• New: Added Heading element - a standalone heading element with flexible styling [Editor V4 Alpha]
• New: Added Paragraph element - a simple, dedicated text element for paragraphs [Editor V4 Alpha]
• New: Added Image element - a modular image element with clean markup and consistent styling [Editor V4 Alpha]
• New: Added Button element - a customizable button element for modular design [Editor V4 Alpha]
• New: Added SVG element - a lightweight element for adding scalable vector graphics [Editor V4 Alpha]
• Tweak: Added AVIF image format support to Lightbox (Tweak: Add avif support in lightbox-manager [ED-18470] #28256, ✅ Add support to AVIF for Elementor Lightbox. #25175, ✅ 🔗 AVIF Support with Lightbox (Duplicate of #25175) #28169, ✅ 🔗 🚀 Lightbox does not open on .avif format images (PR #28256) (Duplicate of #25175) #29624)
• Tweak: Renamed “My Templates” to “Templates” in the Templates Library
• Tweak: Marked local templates as “Site Templates” to distinguish them from Cloud Templates
• Tweak: Excluded from the accessibility tree the Shape Dividers
• Tweak: Improved accessibility with role attributes in the Social Icons widget
• Tweak: Added Display Title control to the Progress Bar widget to enhance accessibility
• Fix: Strings are not translating properly in the Global Style Guide (🔣 🐞 Bug Report: [i18n] Some texts of the Style Guide Preview are not displayed translated #23237)
• Fix: Common scripts loaded late when using the Theme Builder

Pro version

• New: Introduced Cloud Templates - save, manage, and reuse your templates across all your sites from a single cloud library
• Tweak: Improved accessibility with role attributes in Share Buttons widget
• Tweak: Improved accessibility by grouping content with role=region in the Video Playlist widget
• Fix: Focus color is not applied correctly for accessibility in WordPress Menu widget (✅ ♿ 🐞 "Wordpress menu" widget is adding background color by default #24239)
• Fix: Empty results appeared on the frontend when using the Taxonomy Filter with the 'Avoid Duplicates' option in the Loop Grid widget

---

How to Install the Beta Version

If you still haven't enabled beta testing in Elementor, please follow these steps:

1. Go to Elementor > Tools > Versions
2. Enable the beta tester feature
3. Go to Dashboard > Updates and update to the latest beta version.
4. This will get you set up to test the new Elementor 3.29 Beta.

Notes

As we make changes to our GitHub in an effort to keep it organized, improve the way we deliver information to you, and our ability to review your feedback, please follow the instructions below when reporting bugs, or making feature requests:

• To report a bug related to beta versions - open a new 🐞 Bug Report
• For feature requests - open a new 🚀 Feature Request
• For other comments specifically about this beta version - comment here

Designated time for release: May 19th, 2025 (Estimated)

Many thanks for your support and help!

Cheers,
Elementor Team

[m1ga]

• size custom value is missing in all drop-downs (have an issue for that already)
  

• when adding values to e.g. margin desktop and going to tablet is doesn't show the previous values as in v3. Link symbol won't keep state (e.g. if unlocked and only one value it should be unlocked in a new lower breakpoint already)

Bildschirmaufnahme_20250428_111714.webm

• Firefox: when I add a v3 element the "+" icon in the top left corner will be deactivated so I can click it again to go back to add new items. When I add a v4 element it keeps it active state and I can click it to add new widgets to the page.

Bildschirmaufnahme_20250428_111451.webm

[nicholaszein]

Hey @m1ga!

We've been testing the issue you pointed out about Firefox not releasing the selected state of the '+' icon when editing V4 elements. But so far we were not able to reproduce it.

Do you have any additional detail that would help us identify this issue? Maybe a warning in the console?
Are you still experiencing this issue with the latest releases?

[m1ga]

yes, at first I get the usual Firefox error messages in the console: #30071

Uncaught TypeError: h is undefined
    <anonymous> http://localhost/~miga/justElementor/wp-includes/js/wp-auth-check.min.js?ver=6.8.1:2
    Backbone 7
    xhr http://localhost/~miga/justElementor/wp-includes/js/heartbeat.min.js?ver=6.8.1:2
    Backbone 8
    l http://localhost/~miga/justElementor/wp-includes/js/heartbeat.min.js?ver=6.8.1:2
    m http://localhost/~miga/justElementor/wp-includes/js/heartbeat.min.js?ver=6.8.1:2
    connectNow http://localhost/~miga/justElementor/wp-includes/js/heartbeat.min.js?ver=6.8.1:2
    Heartbeat http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.0-beta3:3
    apply http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.0-beta3:3
    run http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    runInstance http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    run http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    internal http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    apply http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.0-beta3:3
    Backbone 9
    apply http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.0-beta3:3
    run http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    runInstance http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    run http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    run http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/web-cli.min.js?ver=3.29.0-beta3:3
    onStart http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.0-beta3:3
    _superPropGet http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.0-beta3:3
    onStart http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.29.0-beta3:3
    Backbone 3
    <anonymous> http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor-loader-v2.min.js?ver=3.29.0-beta3:2
    <anonymous> http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor-loader-v2.min.js?ver=3.29.0-beta3:2

so I have to reload the editor until it is open. Then no error when adding the Alpha widgets, just the + sign is not changing it's state.

JS: showing 3 of 3JS: 2025-03-27 14:02:15 [error X 8][http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/e-react-promotions.min.js?ver=3.28.1:2:33727] elementorV2 is not defined 
JS: 2025-03-27 14:02:15 [error X 5][http://localhost/~miga/justElementor/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.28.1:3:417852] elementor.config.document is undefined 
JS: 2025-03-27 14:02:28 [error X 3][http://localhost/~miga/justElementor/wp-includes/js/wp-auth-check.min.js?ver=6.7.2:2:652] h is undefined 

and my settings:

== Theme ==
	Name: Hello Elementor
	Version: 3.4.1
	Author: Elementor Team
	Child Theme: No

== User ==
	Role: administrator
	WP Profile lang: en-US
	User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:138.0) Gecko/20100101 Firefox/138.0

== Active Plugins ==
	Elementor
		Version: 3.29.0-beta3
		Author: Elementor.com


== Elementor Experiments ==
	Inline Font Icons: Active
	Additional Custom Breakpoints: Active by default
	Container: Active
	Optimized Markup: Inactive by default
	Load Google Fonts locally: Active by default
	Header & Footer: Active by default
	Nested Elements: Active
	Editor Top Bar: Active
	Pages Panel: Inactive by default
	Element Caching: Active by default
	Elementor Home Screen: Active by default
	Elementor Editor Events: Inactive by default
	Atomic Widgets: Active
	Editor V4: Active
	Global Classes: Active
	Variables: Inactive by default
	Launchpad Checklist: Active by default
	Cloud Templates: Active by default
	Editor v4 (Opt In Page): Active by default

[nicholaszein]

Hi @m1ga!

We are still investigating this. So far no one was able to reproduce it, I even throttled the loading of the editor to 2G, but still nothing. So far, all we can gather is that due to it being an unsecure connection, it might take too long for some components to load, which in turn may cause other components to fail. But since it is intermittent, and inconsistent, its difficult to pinpoint exactly what may be causing it.

If you have the opportunity of catching this with the Dev Tools open (and recording the Network) try and see if there are any failed fetches, either cancelled or blocked. Another thing that could help, is enabling Script Debug to get the whole errors (ignoring map warnings). We are trying our best here to reproduce it, and will continue to do so.

Thank you for your patience! 🙏

[m1ga]

Here is a video of the devtools:

Bildschirmaufnahme_20250512_213739.mp4

nothing in there just admin-ajax from time to time.

I was testing it on an instaWP https server and it works the first time I open the editor. The 2nd time it's not working again as in my local tests/videos

Uncaught TypeError: h is undefined
    <anonymous> https://aa-parrot-aa.instawp.xyz/wp-includes/js/wp-auth-check.min.js?ver=6.8.1:2
    Backbone 7
    xhr https://conservative-parrot-d3ddf8.instawp.xyz/wp-includes/js/heartbeat.min.js?ver=6.8.1:2
    Backbone 4
wp-auth-check.min.js:2:652

Status is 200 for all files

[nicholaszein]

Thanks @m1ga! 🙏

We'll keep looking! 💪

[KHcreative]

Thank you for this update! The potential for the new version is astounding.

On first glance however I missed two important, if not essential, features:

1. Without a custom css field (applied to individual classes set in the new editor), the new option of creating these individual classes is actually a step back in terms of flexibility and optimized workflow.
2. Without the option to use clamps and other custom units (e.g. for font sizes) the V4 editor is a huge step back for responsiveness.

Also, the terminology in the style tab doesn't seem to make always sense. For example the "Typography" tab with all its options for the image?
The unification of the style tab for all widgets is a logical and clever move. But, if possible, depending on the widget, the not applicable options could simply be hidden!?

Regarding the custom CSS option: similar to the old editor, adding a tab at the bottom for custom css seems to me the most logical option to add individual styling to each new determined class.

Side note: I really would appreciate it, if you could finally get rid of the automatic container padding.

[m1ga]

for 2: #30166 so you can follow it. I've mentioned it back in February that it is an essential issue and removing existing functionality. But glad to see other people think the same

[doronwolf]

Hi @KHcreative thank you very much for your feedback
Please note this is a very early alpha, and we are very aware of many things that are missing

1. The custom CSS field is still in progress and should roll out later on
2. The custom CSS unit (that enables you to use clamps and other CSS calculations methods) is also still in progress, and should roll out later on
   the possibility to have certain controls disabled if they are not relevant for a certain widget is something we are still considering
   getting rid of the automatic container padding is already possible in V4 (site settings > layout > pdding), V4 site settings is also still WIP

[tobias992]

Perfect. After rows and columns we had containers and now in a few months, again, we can update all our sites to the new v4. Thank you. You guys never get boring. You should make our lives easier and not redesign elementor every year.

[loucasl]

Why the negativity? I'm sure you and many others have criticized Elementor over the years for being bloated, inconsistent and not performant, and now that they've literally rebuilt the editor from the ground up, you're complaining again?

[nicholaszein]

Hi @loucasl,

while we understand your point, we also understand that changes can be scary or worrisome for some people. As @doronwolf mention there is nothing to worry about. So it's ok, as long as the conversation remains civilized! 😉

[tobias992]

@loucasl

The current version of elementor is fine - we have 96% and more with google pagespeed on all our websites. The last updates have improved performance a lot - so why change a running system? New widgets, updates and improvements are fine - but why such a big change? These are 3 major changes in a short period of time (columns, containers and now v4). We manage over 200 websites... that's a lot of work and not every client understands these changes.

Edit: And because of this, the main codebase is very large. Because elementor is backwards compatible to columns, containers and now v4. So 3 big different systems in one plugin.

[nicholaszein]

Hi @tobias992,

Your concerns are valid, and we appreciate you taking the time to share them. 🙏

Please, allow me to clarify some points that you raised:

[...] so why change a running system? New widgets, updates and improvements are fine - but why such a big change?

A: Elementor's vision was and continues to be to empower Web Creators to Build stronger and more sustainable businesses. As technology evolves, and new, more efficient methods emerge, so does the need to improve the tools we use on a day-to-day basis. While we've been continuously enhancing Elementor's capabilities and performance, we knew that to make the next leap and ensure a robust foundation for years to come, we needed to think bigger and better. That's why we are rebuilding many of the Editor's components and capabilities from the ground up to allow us to combine the robustness of the current Editor with next-gen technology and modern design principles, ensuring a better and clean code, enhanced performance, and lay the ground for the future.

While it might feel like we've been changing things in a short period of time, we must not forget that Containers were introduced almost 3 years ago, with Elementor 3.6.0. Since then, technology has evolved a lot, and it's time to rebuild the foundation of Elementor for what's coming next.

And because of this, the main codebase is very large. Because Elementor is backwards compatible to columns, containers and now v4. So 3 big different systems in one plugin.

A: You really don't need to worry about this. Elementor's codebase is very well optimized, only the necessary dependencies are loaded, and only when needed. Maintaining support for Sections, Columns, Containers, and V4 features should not affect the performance of your websites at all, both in the frontend as well as in the backend. In fact Editor V4 components should improve the performance of your websites in both cases.

It's also important to note that we are not releasing the Editor V4 for the general public yet. We are just getting started with the alpha version of some of the new components. While the development of the new codebase is accelerated, we won't be releasing the final version for quite some time. We want to ensure everything will be working correctly, and when it does, there will be methods and instructions to help with the transition to the new components should you choose to do so. Elementor will be releasing extensive documentation and learning content to cover the new features, and the transition, while seemingly scary, should not be difficult at all.

Rest assured, we are taking our time to ensure a smooth transition and a stable release.

[GerardPerret]

@tobias992
I agree to much changes are killing the changes and sometimes it's difficult to follow up.
But on another side for me containers have been a big change but also are much better than sections/Columns were. This has been a great improvment working perfectly even if it was a (not mandatory) work to update existing sites.
I understand that this could be a problem with a lot of sites, but for the moment it's just a prototype, let's wait, make some testing and see how it goes and how the old and new editors/plugins will work together.
From my (old) point of view it's good to think about the futur and better than staying sleeping in a corner ;-)

[GerardPerret]

Hi,
First try to day, interesting approach,
For me the editor looks to work faster. New method to undersand, this will need some time.
I like the idea of classes, would this be applicable in the futur to existing widgets/design?
Are you going to provide a library of basic classes? That would be helpfull to create and organize a set of classes.

Just one issue for me ATM, I am not able to complete a save on my new page, I have tried to deactivate all pluggins except Elementor, set theme to Hello but still the same. Strange as when closing and reopening the page the changes are saved!!.
Not really blocking at the moment, I'll try more.

[GerardPerret]

Hi Nicholas,
I have done what you suggested, deactivate Firewall, removed enhanced protection and deactivate the plugin but still getting the same issue.
I have used the same new page, should I try with a brand new page?
system-info-www.dev.xn--diversit-culturelle-izb.org-30-04-2025.txt

[nicholaszein]

Hi @GerardPerret,

Thank you for the update!

You shouldn't need to create a new page, it should work right away after following those steps. I'm suspecting your cache might be affecting the editor, but before we go that route, can you share what appears in the browser console? To do this you can follow these steps:

1. While with that page opened in Elementor, hit F12 in your keyboard, or hold SHIFT while right clicking inside the Editor Canvas, and then selecting "Inspect Element".
2. A new panel will appear, and at the top of this panel there will be a menu with lots of items. Find the Console one, and click on it.
3. Depending on the case you'll see a few warnings (in yellow) and a few errors (in red). We want to see what are these errors to understand the problem you are experiencing.
4. Take a screenshot or right-click inside the console to save as a log file. You can then share the log file here.

Thank you for helping us debug this issue! 🙏

[GerardPerret]

Hi, hope this is what you are looking for, sorry text is in French which my native language ;-)

V4 Editor Not saving.txt

[nicholaszein]

Hey @GerardPerret!

It appears your issue is indeed related to a firewall block. We've identified the problem and will be releasing a patch soon. Thank you for your help! 🙏

[GerardPerret]

Thank you, I'll keep you informed

[loucasl]

Editor V4 looks absolutely fantastic 🙌

In the future, will transitioning V3 elements to V4 elements be a similar process to "converting" sections to containers?

Or will it be more like activating the Optimized Markup feature where the changes will happen in the background and any custom CSS or styles will either be adapted or need to be tweaked?

[nicholaszein]

Hey @loucasl!

Thank you for the kind words! And thank you for joining the discussion! 🙏

We actually don't have an answer to this question yet. This is something we will be discussing more towards the end of the public testing of the Editor V4, when other components and features will be stable and ready for general use. There will be plenty of time to prepare for the V4 final release. 😉

[Adnans2005]

Thank you so much for the amazing update! Truly an exciting time!
I just noticed something that I wanted to point out.

When creating a class in the editor for example: "white-heading",
When I inspect that element after its published, that is not the actual class name, instead it is "g-9fc0ba9".
If using users creating conflicting class names is a concern such as "e-con-inner", you could prompt an error to the user when they try to create a class with that name.
Editor created class names matching with the CSS class names would be really helpful, especially when adding custom CSS, it can keep the code clean and understandable.
Again thanks for all the updates and improvement, just wanted to clarify and help you guys!

[nicholaszein]

Hi @Adnans2005! 👋

Thank you for joining the discussion, and for sharing your feedback! 🙏

When creating a class in the editor for example: "white-heading", When I inspect that element after its published, that is not the actual class name, instead it is "g-9fc0ba9". If using users creating conflicting class names is a concern such as "e-con-inner", you could prompt an error to the user when they try to create a class with that name. Editor created class names matching with the CSS class names would be really helpful, especially when adding custom CSS, it can keep the code clean and understandable.

A: That's great feedback! Right now, global classes have a unique ID, allowing you to change their names in the Class Manager without losing the applied styles. We will take your suggestions into consideration, though. Thank you for sharing this point of view!

[RonR-WebDesign]

This is so important for debugging. You're asking us to use these new class names but then making it impossible to view those class names... please reconsider!

[lllopo]

I already put this in another reply, but help the things gather steam, I'll leave it also here - I made a discussion for that last week here #31055

[fxaviers]

Hello. I apologize if this has already been answered.
I would like to know when the estimated release date for V4 is. Is it planned for 6 months from now? More?
Since we will need to relearn how to use the editor, it would be good to have an ETA, a forecast, even if it is extended.
This way, anyone who uses Elementor professionally but doesn't want to participate in the Alpha can plan ahead.
Thanks!

[nicholaszein]

Hi @fxaviers!

Thank you for joining the discussion! 🙏

We've mentioned this in both our web.fwrd 2025 event, and last week's Q2 2025 Roadmap event (click the links to watch both if you haven't already 😉), but it's always good to reiterate!

We currently have no fixed date for the release of the Editor V4 to the general public.

This is just the first of a series of releases that we have planned going forward, all focused on adding, enhancing, equalizing, integrating, and stabilizing Editor V4 features before the final release. Until then, we have plenty of things to cover, including providing documentation and educational content that will help users prepare, and transition to the new features in time once they are available to the general public.

Our goal is to ensure a smooth and easy transition for all, and we will announce the release date once we are certain the new features are ready for general use, giving you plenty of time to prepare.

Your role as a user will also influence our Roadmap as we gather feedback about these new features.

Worry not, we will be communicating with you on every step of the way. 😉

PS: Please, don't forget to share your feedback about these new features! 💪

[mottaindustries]

You spelled "performance" wrong in one of the graphics of this post.

[doronwolf]

Fixed! Thank you for noticing and alerting us 🙏

[azkalex]

Wow.. The devs really thought it would be a good idea NOT to show the actual global class name you set on the element, in the DOM too. Isn't the whole point of v4 making everything more consistent? Under no circumstances there should be those IDs showing up as class names instead of the actual class names, what's the point then? I'm already fed up with global colors and fonts having all sorts of IDs.

Many of us are overloading the widgets with custom CSS, filling in missing features, and building our own functionalities with JS. If you're not covering everything, at least provide us a dev friendly environment so we can do it ourselves.

And since this is a feedback section, I also have two requirements that I hope won't be ignored or overlooked once again, because they totally make sense to have:

1. As I said here ❌ Using CSS variables in the color picker doesn't work #25517, allow us to use CSS color variables in the color picker. Do it for v4 at least. We can already set custom units (not in v4 for now, hope it won't be a regression) so why not allow us to use variables for color too?
2. As I said on this one Highlight control if responsive values exist #30810, highlight the control that has responsive values set. If it has values on mobile, highlight it on PC and tablet, if it has values on tablet, highlight it on PC only.

Both of these would be very useful to have, and should've been implemented already, so please consider them this time at least.

Thank you.

[doronwolf]

Hi @azkalex👋 I totally agree - Variables and value placeholders weren't included in this alpha release, but they will be part of V4 soon!. We are still working on them and hope to release them in future versions

[mottaindustries]

you guys are the bomb.  you make me more money and save me time.  thank you for all you do.

[nicholaszein]

Thank you for the kind words @mottaindustries! 🫶

[toltechinternet]

Thank you for the opportunity to test the V4 Editor in alpha—it's been a tremendous experience so far. Well done to the Elementor team on an impressive first alpha build!

One small area of concern I’ve noticed is the new behaviour of the Style tab toggles. In this version, multiple toggles remain open at once, whereas previously, opening one would automatically collapse the others (accordion-style behaviour).

While I can see how having multiple sections open might benefit certain workflows, I’ve personally found it a bit overwhelming—especially when quickly jumping between Typography, Spacing, Background, etc. Over time, it leads to a cluttered view, making it harder to focus or navigate efficiently. I’ve caught myself spending time manually closing panels just to stay oriented.

This might ultimately come down to personal preference, but I wonder if other users might also find the auto-collapse behaviour more conducive to a streamlined workflow. Perhaps a middle ground could be offering this as a user setting—allowing users to choose whether panels should auto-collapse or remain open.

Thanks again for all your hard work on this new editor—it's already shaping up to be a fantastic evolution of the platform. :-)

[doronwolf]

Hi @toltechinternet this is great feedback🙏 we are also debating among ourselves about the correct behavior and definitely going to consider your feedback

[tamelander]

This. Important. User setting.

[blackdog303]

I actually prefer having all the toggles/sections open. I really hate clicking through the multiple menus of Elementor currently, and having a unified style tab that I can scroll through is amazing. It's much easier and quicker for me to edit different style settings on the fly.

I agree that it's probably very much a user preference thing. My background is in Webflow, and this is how their style menu works.

[nicholaszein]

Thanks for the feedback @blackdog303! 🫶

[lllopo]

Just tried the v4 alpha. Many things are still lacking, but hey - it is an alpha, so it is ok. One thing struck me right away, though. The highlight and main goal of the v4 is said to be optimisation and reducing the HTML nodes overhead, yet - the templates are still introducing their own wrappers. I understand they are probably needed, but the thing is they are just empty shells that cannot be styled and layouted properly. This calls the need of internal Flexbox or div which is suboptimal to put it mildly. I've described how i think this should be handled in #31049 .

[nicholaszein]

Hi @lllopo!

Thank you so much for your feedback, and for showing interest in testing the Editor V4 features! 🙏

Right now, Elementor V4 only touches the fundamental parts of the Atomic Elements, Global Classes, unified Styles, and Responsive designs. Everything else is still part of Elementor V3, and was not changed for this first alpha stage. We want to make sure these work as intended and are stable enough so we can move to improve other components. The best way to do this is to gather feedback from users like you.

Nonetheless, you've made valid points, and we will keep them in mind for the future! 😉

[doronwolf]

Hi @bddevfarid 👋 I totally agree - CSS transform, opacity, and transitions weren't included in this alpha release, but they will be part of V4 soon!. We are still working on them and hope to release them in future versions

[tesuh]

Interesting that no one mentioned this yet. But, I really need the created selector to be persistent after I travel back to it.

So, I have to make sure that I click to the class name that I created to not accidentally style the local one, because it just defaults back to it.

I love the performance! So fluid and snappy compared to previous editor.

Also, I can't see the Atomic ones when I'm editing a loop template. Will it be available there?

Thanks.

[RonR-WebDesign]

If we create a new class then YES, make it persistent. Reverting to local makes no sense! The colors are enough of a clue so we are well aware of which we are modifying. I would consider not waiting, this is a big deal!

[doronwolf]

Hi @tesuh - when editing the loop template, try to search 'atomic' in the widgets search bar - you will see the atomic widgets are still available in this template editing mode (but currently only by search),
Thank you for noticing 🙏 This will be fixed in future versions

[tesuh]

Hi!

I did find them when searched. Didn't think about searching :)

Dynamic tags are missing, but I'm assuming it will be available when the V4 is stable?

I work quite a lot with dynamic content. Is the V4 features will be rolling out gradually to include pro features?

I also tried searching for dynamic tags, but no results was found, for example, Featured Image.

[nicholaszein]

Yes @tesuh, that's correct. Pro features will be implemented gradually as the new components mature. 😉

[doronwolf]

Hi @tesuh yes, we are aware some tags are missing, it's still WIP to make all of them work smoothly with the new V4 UI,
and as Nicholas said - more and more features, including Pro features, will be implemented gradually as the new components mature.
Please make sure not to use V4 on a production site since it's not stable yet 🙏

[antoine-piarou]

That's promising!

Isn't it possible to generate a title style based on its parent?

Ex: I create a card-movie and inside I have a heading-h3.

The base .heading-h3 is black.

How can I make .card-movie .heading-h3 red?

That way, every time I put an h3 heading in a .card-movie, it's red (I don't need to add a .text-red class).

And if I want to turn all the .card-movie .heading-h3s green, I just need to modify .card-movie .heading-h3 (without having to remove all the .text-red classes).

This seems like basic CSS?

[nicholaszein]

Hi @antoine-piarou!

Thank you for joining the discussion! 🙏

That's a great idea! This feature is usually called "Relative Styling". Currently classes are applied only to each Atomic Element individually, without any correlation to other elements. But this is something we could consider implementing to Elementor once we release V4 if we see there is enough demand for it!

Thank you so much for the suggestion! 💪

Have you tested the other features we released in this version? We would love your feedback about them too! 🙂

[MichalisDBA]

I agree with Adnans2005. Defining a class name should show the same name at the HTML DOM code and not some random pseudo class-name-ID. Other builders do that just fine.

Also another suggestion. Have an option to disable ALL old widgets and elements and use only the Atomic ones. And by disable i mean to not load them anywhere in the Elementor's code when you edit a page or render a page on the frontend. Think of it as Elementor DEV Mode. Only the basic Atomic elements.

[lllopo]

I've opened a discussion for that, if I get you right : 31055

[nicholaszein]

Hi @MichalisDBA!

Thank you for your feedback and suggestions! 🙏

You can technically already disable any element using the Element Manager. Although having elements active doesn't have any impact in your website if they aren't in use.

I hope that helps!

Let us know how is your experience with the features we released in this beta! We would love to know your feedback about using them! 🙂

[avivu]

Hi all,

We just released Elementor v3.29 Beta 2.

The versions include the following:

Free version

• Fix: Mask shape URLs use double slashes instead of single slashes (✅ 🐞 Double slashes in mask-shapes css url #17534)
• Fix: Dragging a Heading element between cells causes flickering and layout issues [Editor V4 Alpha]
• Fix: "Align self" icons do not rotate to match the parent flex direction [Editor V4 Alpha]
• Fix: Dashed border of the empty element view incorrectly responds to align-items changes [Editor V4 Alpha]
• Fix: Element link color is overridden by the theme or site kit on the frontend [Editor V4 Alpha]
• Fix: Elements are not dragged properly on the canvas and are positioned at the bottom [Editor V4 Alpha]
• Fix: Cog icon is missing when the dynamic tags popover is open [Editor V4 Alpha]
• Fix: Class hierarchy is not displayed correctly in the editor [Editor V4 Alpha]
• Fix: Linked element displays a text cursor instead of a pointer [Editor V4 Alpha]

Pro version

• Fix: Errors occur when Debug mode is enabled and the Optimized Markup experiment is active

–

Thank you!

[avivu]

Hi all,

We just released Elementor Free v3.29 Beta 3.

The versions include the following:

Free version

• Tweak: Added sticky behavior to the Classes field
• Tweak: Added visual cues for invalid class names in the Classes field
• Fix: Element Empty view dashed border reacts to align item value
• Fix: 'Publish' button became active after removing a link
• Fix: Linked Heading displayed an incorrect text cursor on hover

Pro version

No change.

–

Thank you!

[RonR-WebDesign]

Regarding centering buttons, I'm using: Flexbox Widget > Style > Layout > Display Flex > Direction Row

I cannot find a way to make a button centered on it's own row. For the current button layout, I use Layout > Width > Full Width(100%).

If I do Size > Width and make it 100%, it makes the button it's full width.

[doronwolf]

Hi @RonR-WebDesign, in V3, the button had an extra wrapper div, which allowed you to set the wrapper to 100% while the button itself was centered and didn't use 100% width
V4 is using minimum div's so if you want a V4 button to be entered in a line of its own (inside flex row + warp on), without stretching it to 100% width, you will need to add margins from both side (left & right) of the button (...or add another div block to warp it the button like it had in V3 which is also o.k)
Here is an example
https://github.com/user-attachments/assets/e466e624-0cdd-4cab-87e1-379f65dfbc8c

[RonR-WebDesign]

Thanks so much for the explanation. I appreciate the effort. That makes total sense...

[nicholaszein]

Hi @RonR-WebDesign!

@doronwolf's video is spot-on! 💪

In native CSS (writing it by hand) there are plenty of different ways of achieving this. For a layout like yours the best way would be using CSS Grid (coming soon to V4 😉) if the goal was going to be using zero divs.

Both the examples from Doron were great alternatives. It all really depends on how you want your layout to flow across all screens. There is no right way of doing this.

One thing front-end developers usually do is to group elements that are siblings, and leave single elements by themselves. So in your case for example, you could change the direction of the Parent Flexbox to Column, justify the content to Start and Align Items to Center. Next, insert the Button first, then a Div with the two Images inside, grouping them as siblings (since they are the same element). On mobile it would be easier to move the Button to the bottom for example.

I hope this helps! 🙂

[RonR-WebDesign]

Thanks, this is very helpful. Sometimes we are used to doing things only one way and fail to broaden our thinking. 🙂

[mbaierl]

Found a very special bug.
To reproduce:

• create a new user
• login as this user
• go to the user profile, disable Elementor AI. Do this prior doing anything else
• now edit a page with Elementor
• the editor is not useable, not possible to scroll or to click.

Reason for this bug: if Elementor AI is disabled in the user profile the announcement info is not rendered, but the frontend code is not smart enough to check, if there are any announcements to show and fails with an error (trying to access ['title‘] on a null object. This leaves just the empty, full screen, transparent background of the announcement, which cannot be clicked away.

Solution: add an if-statement in the frontend code of the Announcements class.

[nicholaszein]

Hey @mbaierl,

I've tried following your steps but wasn't able to reproduce the issue you've reported. Here's a video I recorded. I tried with both the stable version of Elementor, and also this Beta. In both cases I was able to edit with Elementor without any issues.

betareportaiconflictineditor-optimized.mp4

(the video is sped up to make it faster/easier to watch through all the steps)

As you can see at the end, there is nothing in the console as well.

Did I miss something while following your STRs?

[mbaierl]

Hi, try to edit a page that already exists. Elementor tries to show a announcement info for AI, and this breaks the editor...

[nicholaszein]

Hi @mbaierl.

I did some tests, and still, no issues on my side. Any other pointers? Are you still experiencing the issue?

useraiissue-optimized.mp4

[mbaierl]

Hi @nicholaszein , thanks for asking again.
I've solve this issue by setting these fields in the user_meta / field elementor_introduction to true:

		'ai_get_started' => true,
		'ai-get-started-announcement' => true,
		'ai_promotion_introduction_media-edit' => true,

Now the announcement-screen does not fail and block the Elementor interface. I'll report back if it happens again.

Thanks,
Michael

[nicholaszein]

Thank you @mbaierl!

Let me know if you happen to reproduce the issue again! 🙏

[suasgn]

I am planning to create a deep integration for Tailwind CSS. However, the pseudo-ed class name on the DOM, whether in the editor or frontpage, is a blocker. I hope this will be reevaluated soon.

[doronwolf]

Hi @suasgn & @lllopo, We hear you and appreciate your feedback
We are actively looking for a way to incorporate this feedback without losing the benefits of the ID approach, so it might take some time

[suasgn]

Hi @doronwolf, could you clarify the ID approach and the reasoning behind this decision? This is unusual and does not align with common expectations for using a Class.

[nicholaszein]

Hi @suasgn.

Thanks for joining and sharing your feedback. 🙏

To answer your last question, there are a few reasons why we went with this approach, but the main one is consistency across components. It's one source of truth that will always be the same everywhere, all the time. Including when copying and pasting, exporting and importing, changing names, migrating, updating plugins, adding additional features, backwards compatibility, compatibility with addons, and the list goes on.

Of course we understand the expectation regarding this feature, and as Doron said, we appreciate your feedback and are actively working on it.

This is why we opened the Alpha version for testing and feedback so early, to be able to gather your feedback and make changes now before we decide on finishing these features. And we are grateful to hear from you!

[suasgn]

Hi @nicholaszein,

Thank you for the explanation. I understand now the reasoning behind this approach.
I have not explored the codebase deeply, but I believe that you have implemented the correct system for this approach. It is only a matter of the render/output. Instead of rendering the class in the DOM with the g-<id> format, you can use the label, which we believe are the actual class names.

This means you still maintain the source of truth, compatibility, and other matters you have described, while also addressing our feedback.

[nicholaszein]

@suasgn,

we are thinking about this and other factors as well. We will find a way! 😉

One point I forgot to mention, is that once a class name is updated, it would need to be updated across all documents using the same class. Imagine having to update hundreds of documents at a time on a really busy website. That's one of the reasons why we decided to go with the unique identifier.

Thank you for sharing your point of view. We really appreciate it! We will take this all into account! 🙏

PS: Don't forget to test the Cloud Templates feature from Elementor Pro, and come back to let us know how was your experience! 💪

[caleb-bright]

Glad to see great progress for Elementor v4! I'm excited for the improved performance and the other features that will greatly improve the building efficiency. One thing I have to say is I like the new class system but would love to have the classes be the same in the DOM as in the editor. This would allow for more flexibility and design opportunities verus the generated ones.

[nicholaszein]

Hi @caleb-bright !

Thank you so much for the feedback, and for joining the discussion! 🙏

We are listening, and really appreciate the point of view (as others expressed as well).

We are discussing how to handle this, as it affects an entire site, and will continue to work on improving this feature.

Please let us know about your experience with the other components, including the Cloud Library!

Regards

[blackdog303]

I’m having some issues updating the plugin to the latest (Beta 3).

It detects the update and asks me to update, but every time I try it says update failed: Not Found. The website is hosted on WP Engine (it’s on a staging domain) - but I don’t know if there’s an issue with how they cache the plugins for updates? Everything else seems to be working ok though…

[nicholaszein]

Hi @blackdog303!

Thank you for showing interest in testing this beta! 🙏

Apologies, I didn't see your comment.

Once the Beta is enabled, WordPress should find the plugin version directly from their servers. The installation process is handled by WordPress itself. What you are reporting is likely a problem with your installation. This could be indeed an issues with how WP Engine cache plugins. They may not be pulling other branches, only the main one.

You can download the plugin from this link below, and upload it manually. WordPress will ask you if you want to replace the existing plugin. Then the Pro beta will appear for you to install if you have it.
https://github.com/elementor/elementor/releases/download/3.29.0-beta3/elementor-3.29.0-beta3.zip

[avivu]

Hi all,

We just released Elementor Free v3.29 Beta4 & Elementor Pro Beta3.

The versions include the following:

Free version

• Fix: Background requests are blocked by WAF rule 25 and prevent Global Classes from being saved
• Fix: 'New Prompt' Button does not work in Generate Code Feature

Pro version

• Tweak: General UI changes.

–

Thank you!

[nicholaszein]

Hey beta testers!

Elementor and Elementor Pro version 3.29.0 were released to the public! 🚀 🥳 🙌

Thank you all for sharing your feedback about the new Editor V4 alpha, and helping us test this new version! 🙏

🧪 New Editor V4 Discussion category ✨

We are happy to announce a new space here on GitHub created specially for gathering your continued feedback about the Editor V4 as we release updates and new features. We want to keep an open communication channel between you and us, and we welcome your input during the development of the Editor V4. 🤗 🤝

If you have any feedback, we encourage you to share it in the Editor V4 Discussions category! 😉

We also created a dedicated form for 🐛Reporting Bugs in the Editor V4, in case you find bugs related to the new features in the Editor V4. This way we keep things organized and can act quickly to solve issues specific to the new editor. 💪

Special thanks go to these contributors who helped make this release possible:

• @m1ga
• @KHcreative
• @tobias992
• @loucasl
• @GerardPerret
• @Adnans2005
• @RonR-WebDesign
• @lllopo
• @fxaviers
• @mottaindustries (eagle eyes 👀)
• @azkalex
• @toltechinternet
• @tamelander
• @blackdog303
• @tesuh
• @antoine-piarou
• @MichalisDBA
• @mbaierl
• @suasgn
• @caleb-bright

See you there! 👋

Cheers 🥂

Changelogs of Elementor Core and Pro + Additional Information:
Elementor Core
Elementor Pro
Developers Update