✅ 🚀 Elementor v3.5.0 Beta 6 Release 🚀

[DorShahar]

Beta 6 UPDATED - PLEASE READ BELOW!

Hi Elementor Beta Testers,

We are incredibly excited to introduce our new beta version, Elementor v3.5, which is all about increasing your design capabilities and improving your workflow.

The new design features will allow you to elevate the appearance of your website and achieve visual effects that previously would have required additional coding or 3rd party plugins.

With the workflow improvements, you will be able to shave off significant time from your project’s turnaround by improving productivity and eliminating redundant tasks.

Try out Elementor v3.5 Beta and let us know what you think about our newest additions, including:

• CSS Transform
• Text Stroke
• Word Spacing Control
• Mark Widgets as Favorites
• Multi-Select
• Drag from Desktop
• New Experiments UI

Before you test, please make sure you are using:

• Elementor v3.5.0 Beta 6
• Elementor Pro v3.5.2

Enhancing Styling Capabilities

Meet CSS Transform - Animate any Element

Would you like to rotate any element on your page on any axis, or enlarge an element upon hover to achieve highly engaging and trendy effects, but you don’t know CSS?
No problem!
From now on, you can rotate, scale, skew, offset and flip any element on your page, within Elementor, without requiring a single line of code, that way - you gain complete control over your designs and achieve capabilities that weren’t available before.

To take your element design to the next level, you can pair CSS Transform with our Pro feature - Motion Effects, to create incredible designs, without a single line of CSS or an extra plugin.

Following is a list of CSS transformations available:

• Rotate - 2D & 3D rotation: pivot element in any dimension
• Scale - Increase or decrease the element’s size
• Skew - Transformation that skews an element
• Offset - Translate an element vertically or horizontally
• Flip - Create a mirror effect of the element - vertically or horizontally

Here’s how it works:

1. Create a new page, edit it with Elementor, and drag & drop any widget
2. Go to Advanced > Transform
3. Play around with the different options and make sure everything works as expected
4. If you are a Pro user:
   a. Make sure you updated to Elementor Pro 3.5.0
   b. Apply scrolling effects to this widget via Advanced > Motion Effects > Scrolling effects
   c. Play around with the different options and make sure everything works as expected with motion effect as well

Text Stroke

Text Stroke is a styling property that allows you to add a text stroke (outline) to any heading you wish to.

Adding Text Stroke allows you to highlight specific elements on the page by giving them an outline. With this styling option, you can set the font to transparent, and use text stroke to create an outline, or you can choose a color for the text, and a separate color for the outline to make your design stand out.

Text stroke will be available for the following widgets: Icon Box, Tabs, Accordion, and Text Path. It will also be available for the following Pro widgets in the upcoming Elementor Pro v3.6: Posts, Animated Headline, Price List, Price Table, Flip Box, Call to Action, Testimonial Carousel, and Countdown.

Here’s how it works:

1. Create a new Page, edit it with Elementor and drag & drop Heading widget
2. Go to the widget’s panel, and under Style > Title click on Text Stroke control
3. Play around with the different options and make sure everything works as expected
4. This feature is also supported in the Icon Box widget, Tabs widget, Accordion widget, and Text path widget
5. Make sure everything works as expected both on Frontend and in the Editor

Word Spacing Control

Similar to Letter Spacing, the new Word Spacing control in the typography group control allows you to set the distance between one word and another. Doing so enables you to increase your design customization of textual elements, including but not limited to headings, text editors, buttons, and more.

** Here’s how it works:**

1. Under any widget that contains text, go to “Style” tab
2. Click the Pencil “edit” icon of the Typography control
3. Change the space between words using the “Word spacing” control
4. Use this setting in a Global Font
5. Make sure everything works as expected both on Frontend and in the Editor

Improving Workflow and Productivity

Meet Favorite Widgets - Save Precious Time and Pin your Favorite Widgets

As you tend to generate an affinity towards specific widgets and use them often, we’ve created a dedicated ‘Favorites’ section in the Editor Panel for you to pin your favorite widgets to. While we always encourage you to incorporate new widgets in your websites, when they are appropriate, pinning widgets to your ‘Favorites’ section will allow you to work faster by personalizing the Editor to you.

Once you mark widgets as your favorite, they will appear in a dedicated ‘Favorites’ section. Widgets added to this section will appear in alphabetical order.

Here’s how it works:

1. Edit a page with Elementor
2. Open the widgets panel
3. Right click on any widget
4. Click “Add to Favorites”
5. The widget will now appear at the top of the panel under a dedicated “Favorites” section
6. Go to a different page or post in your site and make sure the settings has been saved for your user
7. Switch user and see that the settings are relevant only for your user

Multi-Select - Work Faster and Impact Several Elements at Once

As you build out your websites, you may notice that the style of some sections, columns or widgets repeat themselves throughout the page, or that you would like to copy, or delete a number of them simultaneously. To improve your workflow and allow you to scale your website creation, you can leverage multi-select to impact multiple elements at once; including: copy, delete, duplicate, paste, paste style, and reset style.

For example, by clicking ctrl (or CMD in Mac) while clicking a number of widgets, columns or sections in the editor or the navigator, you can delete them instantly, instead of deleting them one by one. Another example is when you have a number of similar elements, such as button widgets in a column, and you want to make them all in one row, you can style one of them to be in-line, and instantly copy that style to all the other buttons, at once.

Here’s how it works:

1. Edit a page using Elementor
2. Select any page element
3. Press the ctrl key (CMD key on mac)
4. Select additional page elements in the live preview and / or the navigator panel
5. Supported actions will apply for the entire selection

Drag from Desktop - Improve your Workflow by Dragging Media Files Directly into the Editor

Skip the: “upload to media library,” drag in a widget ,and select the media file steps, and simply drag media files from your desktop directly onto the page. You can drag one or several media files to the editor, and have them all appear in one section, making your workflow easier, and more efficient.

Dragging a media file onto the page will automatically add the media files to the media library, and create the correlating widget on the page (a dragged image will automatically place an image widget in the section, and a video will automatically place a video widget in the section).

In addition to media files, you’ll be able to easily drag any saved templates files (.json) onto your website.

Here’s how it works:

1. Edit a page with Elementor
2. Drag one or multiple images from your desktop into the screen
3. Repeat the same step for videos and exported Elementor template files (.json)
4. The assets will be uploaded to the media library and added to the page as the corresponding widgets

Tweak: Improved Experiments UI

The improved Experiments user interface makes it easier for you to understand the maturity and status of each experiment. The top section of experiments displays those that are ongoing, and displays their status - alpha or beta, whereas the bottom section displays those that are more stable.

With the new interface, you can also activate and deactivate all experiments in a single-click.

Here’s how it works:

1. Go to the WP Dashboard > Elementor > Settings > Experiments tab
2. Activate some experiments
3. Click on Deactivate all experiments button. Make sure all the experiments are in Inactive status
4. Go to the Editor and make sure there isn’t an experiment in an active state (for example no Additional Custom Breakpoints, no Color Sampler, etc’)
5. Go back to WP dashboard and make sure there isn’t an experiment in an active state (for example no Import Export template)
6. Go back to the Experiments tab and click on Activate all experiments. Make sure all the experiments are in the Active status
7. Repeat steps (4) and (5) and this time make sure the experiments are working properly

Eicons library is now supported in the inline SVG experiment

This new experiment achieves faster page load by changing the loading mechanism of eicons into inline SVG. Keeping up with our commitment to simplifying the process and making constant performance improvement so your website can load rapidly, with this experiment turned on, we reduce CSS and Woff size on each page load by up to 111KB. Read more about how Elementor improved asset loading.

Here’s how it works:

1. Make sure the Inline Font Icons experiment is Inactive in Settings > Experiments
2. Create a new page, Drag & Drop an Image widget, and choose any image.
3. Under the Content tab, set Link to Media file and Lightbox to Yes.
4. Preview the page, click on the image to launch the Lightbox. Make sure it works.
5. In developers tool, under the network tab, look for “eicons” files. Make sure they appear.
6. Go back to the Experiments tab, and activate Inline Font Icons experiment
7. Reload the page you recently created.
8. In the developers tool, make sure all assets related to font Awesome and eicons were not loaded
9. Make sure everything is working as expected with various widgets that contain icons both on Frontend and Editor.

More Improvements

• New: Meet Multi-Select for page elements - improve your workflow process by making bulk actions (Navigator bulk operations #8006, Grouping elements #879)

• New: Added Text Stroke control - highlight titles with colorful outlines to in Heading widget, Icon Box widget, Tabs widget, Accordion widget, and Text path widget

• New: Meet Favorite widgets section - save your most useful widgets for easier accessibility (✅ 🔗 🚀 Feature Request: Management of Elements (Duplicate) #2184,Create a Commonly Used Widget Area #11443)

• New: Introducing CSS Transform - rotate, scale, skew, offset and flip any element (Multiple transform values #12451)

• Experiment: Hide native WordPress widgets from search results - remove unwanted widgets from the widgets panel

• Tweak: Meet the new experiments UI - find easily experiments

• Tweak: Added Inline Font Icons experiment to work with eicons library (Enqueues unnecessary JS files on the frontend #8572, SVG icon instead of eicons font #11361)

• Tweak: Added Elementor price plan filter to Kit Library (Elementor Template Kit Library: "Expert" tag doesn't show nothing. I expected it to show Expert Templates. #16075)

• Tweak: Added reverse columns to Additional Custom Breakpoints Experiment (Section > Responsive > Reverse Columns - does not work for mobile, if I change the breakpoint. #16322, BUG: Reverse Columns are not reversing based on custom breakpoints #12925)

• Tweak: Added the option to search by tag names in Kit Library (Elementor Template Kit Library: "Expert" tag doesn't show nothing. I expected it to show Expert Templates. #16075)

• Tweak: Deprecated get_add_new_landing_page_url (props @HeyMehedi )

• Tweak: Added word spacing control to typography settings

• Tweak: Added promotion for Custom Code feature

• Tweak: Removed the Archive Posts and Archive Title widgets from widgets panel search in non-archive templates

• Tweak: Extend "Edit Buttons" options for 3rd party developers

• Tweak: Optimize Kit library index page performance

• Tweak: 'Editor/Documents' moved to /editor/components folder

• Tweak: Prompt the user permission to allow unfiltered file uploads in the Import Kit flow

• Tweak: Added filter to Context Menu Groups

• Tweak: Preparation for Pro feature

• Tweak: UI improvement for cascaded control units

• Tweak: Added shortkeys description to the tooltips in the footer of the editor panel

• Tweak: Added a quick Apply Kit modal option in the Kit Library

• Tweak: Improved performance of WP_Query by adding no_found_rows=true parameter

• Tweak: Improved performance of loading the "My templates" while loading the Templates library

• Tweak: Minimum height wasn't defined to all responsive devices

• Tweak: Experiments status added to the system info for better debugging

• Tweak: Added Safe mode support for Elementor Experiments

• Tweak: Updated Dialog library to 4.9.0

• Tweak: Added a unified registration for components for widgets, controls, form actions, dynamic tags, and finder categories

• Tweak: Added support for future feature compatibility

• Tweak: Disable the option to change the desktop height and width fields in the responsive bar

• Tweak: Detect and present errors in the Import / Export flow for better troubleshooting

• Fix: Hamburger button didn't open on mobile in Nav menu widget (My mobile menus do not even work after this last update and switching to dev platform. I am also getting double drop down icons on my menus across the entire site #16682)

• Fix: Possible conflict between Jet-Engine and Elementor Form widget (The Form widget does not work if the widget has a custom repeater in the Advanced tab #13117)

• Fix: Finder incorrectly identifies pages created through Finder as a Post type instead of Page type (Finder incorrectly identifies pages created through Finder as a Post type instead of Page type. #12502)

• Fix: Unexpected behavior if ctrl + mouse click was used on mac (Element dragging after right click on Mac ( when I didn't select anything in the right click menu ) #5228)

• Fix: Edit header handles don't show up if the z-index of the header section is above 99 (small weakness in the elementor editor (header z-index & section editor) #16214)

• Fix: Dividers not vertically centered in Icon List widget (BUG / Icon List Widget Divider #16431)

• Fix: SVG sanitizer is failing if there is a line break after </svg

• Fix: Slides per view can't be set to default if there is a value in widescreen in the Testimonial Carousel widget (MEDIA CAROUSEL // Cannot change number of "Slides Per View" depending on NEW additional Breakpoints #16210)

• Fix: Image Carousel widget ignored padding and margin inside columns

• Fix: Theme Builder close button not functioning if the page was refreshed

• Fix: Pro widget promotional popover CTA text was incorrect when Elementor Pro is activated but not connected

• Fix: Section editing handle is not accessible when Section is placed below a Header

• Fix: Run DB calculations only on sites that are required to

• Fix: Updated Admin Top Bar font for Non-English languages

• Fix: UI glitch in Google maps widgets

• Deprecated: See all deprecations to this version in our Developers Deprecations Post

Make an Impact: Share Feedback Before Features Are Released

We’re always looking to get to know Elementor customers on a deeper level. If you’re interested in meeting with our team and sharing your insights, feedback, and feature requests you’re welcome to sign up for some quality time with us here. Or download Elementor’s Dev Edition. Talk soon!

---

How to Install the Beta Version

• If you still haven't enabled beta testing in Elementor, please follow these steps:
• Go to Elementor > Tools > Versions.
• Enable the beta tester feature.
• Go to the Dashboard > Updates and update to the latest beta version.
• You can also download the new version here: https://downloads.wordpress.org/plugin/elementor.3.5.0-beta8.zip

---

Notes
For bugs and remarks, please reply with a comment on this issue here on GitHub.
Please keep this related to the current beta only! For any other issue or feature request, feel free to open a new issue.
Designated time for release: December 15, 2021 (Estimated)

Many thanks for your support and help!
Cheers,
Elementor Team

[79ho3ein]

excellent. It would be great if the transform feature worked for sections and columns as well. Currently only works on widgets.
Overall everything is great. Great job

There seems to be a problem using the inner section widget :

Untitled.Project.mp4

[rodolphebertozzo]

Please see : #16793

[DorShahar]

Hi @rodolphebertozzo - thank you for reporting, we will investigate this on

---

@79ho3ein - thank you for your feedback. There is no plan to apply transformation for columns and sections since they are the main blocks for the page layout, and other elements are relative to them.

As for the inner section: we will investigate.

[fabigrafo]

Hi! Yes, that's all very nice.

CSS transform and text stroke are very useful for the design, but the other things are probably not that important in my eyes and especially not at this point in time. But still nice that Elementor is being improved in small steps in some places.

There is a video from Elementor that I think was released in the summer with an announcement of features that should appear in 2021. Will we actually see all of the announced features in Elementor in 2021? I think time is getting scarcer, especially considering the beta lead time and only one milestone is removed from the list in this version.

What can already be seen in Dev or Beta Edition is marked in bold and what is already included in the official release is ticked off. There is still a lot (important) missing.

You also posted this picture on Twitter. Is that a serious picture and if so, when is this new surface planned for?
I have to say, I like the (supposedly) new interface very much, it leaves some problems that have been solved a bit cumbersome so far, such as the left editor column, which can be very annoying when you are working on the design, and the responsive bar does not always have to be faded in and out with great effort.

Thank you in advance for your feedback and wish you a good start to the week.

[DorShahar]

Hi @fabianenzensperger
Thank you for your comment.
You marked that performance as an unchecked checkbox.
Well, we are constantly improving our performance. You can see in the following blog posts and Beta posts how we improved our infrastructure:

1. Additional Custom Breakpoint - the reason it took a while to develop it since we didn't compromise in performance, and we improved up to 23% in page load time and we reduce the widgets and controls data load by about a third (from 900KB to 600KB).
2. Improved Assets loading experiment - load only the assets that are in use on the page.
3. Improved CSS Loading experiment - in v3.3.0 we added a new experiment that saved 120KB in Core and 225KB in Pro
4. Optimize DOM experiment - we are constantly improving our DOM structure

We encourage you to activate the experience and improve your page performance.
In addition, we do not stop improving our page performance in general, and focusing on performance in every single feature that we are releasing.

Thanks

[Michaelgimii]

hi @DorShahar, Will neew editor ui be released in 2021?

[DorShahar]

Hi all
The new UI is under development and it's only a POC at the moment.
Please keep this thread only for issues related to the beta.

Thanks

[rodolphebertozzo]

Hi @DorShahar,
Wasn't the new element container planned for this version normally?

[fabigrafo]

Hi all The new UI is under development and it's only a POC at the moment. Please keep this thread only for issues related to the beta.

Thanks

Hi @DorShahar,

OK, thanks for the info and sorry that I mentioned it above. If you need help in this regard, I am happy to offer it via a different communication channel. But from now on it's only about this beta, sorry. 😁

Greetings

[fabigrafo]

Hi @fabianenzensperger Thank you for your comment. You marked that performance as an unchecked checkbox. Well, we are constantly improving our performance. You can see in the following blog posts and Beta posts how we improved our infrastructure:

1. Additional Custom Breakpoint - the reason it took a while to develop it since we didn't compromise in performance, and we improved up to 23% in page load time and we reduce the widgets and controls data load by about a third (from 900KB to 600KB).
2. Improved Assets loading experiment - load only the assets that are in use on the page.
3. Improved CSS Loading experiment - in v3.3.0 we added a new experiment that saved 120KB in Core and 225KB in Pro
4. Optimize DOM experiment - we are constantly improving our DOM structure

We encourage you to activate the experience and improve your page performance. In addition, we do not stop improving our page performance in general, and focusing on performance in every single feature that we are releasing.

Thanks

Hey @DorShahar,

you are definitely right and the performance is actually noticeable! I am aware of these things, I just didn't tick it off because there were always improvements over the year and one or the other thing has not yet been completed or there could be further improvements right now with regard to "Div / Container Widget", "Flexbox Container" and "Nested Elements".

That should again ensure performance, I think. 🤗

[rodolphebertozzo]

Hi! Yes, that's all very nice.

CSS transform and text stroke are very useful for the design, but the other things are probably not that important in my eyes and especially not at this point in time. But still nice that Elementor is being improved in small steps in some places.

There is a video from Elementor that I think was released in the summer with an announcement of features that should appear in 2021. Will we actually see all of the announced features in Elementor in 2021? I think time is getting scarcer, especially considering the beta lead time and only one milestone is removed from the list in this version.

What can already be seen in Dev or Beta Edition is marked in bold and what is already included in the official release is ticked off. There is still a lot (important) missing.

You also posted this picture on Twitter. Is that a serious picture and if so, when is this new surface planned for? I have to say, I like the (supposedly) new interface very much, it leaves some problems that have been solved a bit cumbersome so far, such as the left editor column, which can be very annoying when you are working on the design, and the responsive bar does not always have to be faded in and out with great effort.

Thank you in advance for your feedback and wish you a good start to the week.

Hi @fabien, I agree with your state of mind!
Indeed, having thought about it for a long time, the classic editor is not bad in itself, but not clean enough and with too many cumbersome elements, and to come to a new editor with what seems to be a floating bar to manage the options of each element and a floating window that opens when you want to add the elements (and I refer to what I see on the picture) seems to me to be something extraordinary and magical. @DorShahar, @shilo-ey, In any case, you have all my support for the wonderful work you are doing, and I will continue more than ever, maybe less in beta but directly in the development versions to test as soon as possible each of your features and to give you my feedbacks.