Hi Elementor beta testers,
We are incredibly excited to introduce our new beta versions, Elementor and Elementor Pro 3.10, which introduce major new additions that will take your website design and responsiveness to a whole other level. These versions include the new Tabs widget, which is getting a complete overhaul.
Try out our new beta versions and let us know what you think about our newest additions, which include:
Meet Nested Elements – the future of design with Elementor widgets
Nested elements empower you to take any element and place it inside another widget. This unlocks full design flexibility, and enhances what you’re capable of doing with each widget in terms of what it looks like, and what content it includes. As Flexbox Containers are stable, we have spent the past few weeks revisiting all our old widgets, some created over 5 years ago, to enable nesting capabilities in every widget that it would be relevant for. These include creating widgets to replace Carousel, Accordion, Tabs, and more.
Elementor 3.10 includes the first widget, to include Nested Elements – Tabs. During the upcoming releases, we will gradually be introducing more of these widgets.
Introducing the Renewed Tabs Widget – The first Elementor nested widget, unlocking design flexibility
Elementor 3.10 includes the new Tabs widget as an alpha experiment, which allows you to elevate the design of your website and unleash your creativity when displaying tabs on your website. The new Tabs widget, which is container-based, will replace the existing Tabs widget and will enable you to nest elements within each tab, and make your design options with Tabs endless. The new Tabs widget has three main improvements:
To use the new Tabs widget, you will need to first enable the Flexbox Container and Nested Elements experiments, then the Tabs widget in the widget panel will automatically be replaced with the new Tabs widget.
How to Test It:
Introducing Custom Units – A new way to choose any unit you want, including CSS Math Functions
Many elements in the Editor include options for sizing, such as padding and margins, where you can choose between
VH units. Up until now, any time you would adjust the sizing of an element, you would have to choose one of these units. For example, if you wanted to add padding to an element, you would have to choose which measurement unit you wanted to use, you wouldn’t be able to use more than one.
With this update, the unit labels will be moved into a drop down menu, and you will be able to choose the new Custom option. Choosing custom will allow you to combine a number of different measurement units, as well as run calculations for the measurement of values within the value input field, that way you can achieve greater design accuracy and responsive support.
For example, when choosing the custom option in the typography size controls, you will be able to use the
clamp() CSS function to adjust your typography size to different device sizes, or the
calc() CSS function to calculate and set a value that mixes units, and more.
As part of this version, the following controls will get custom options:
This will be expanded further to additional areas in future releases.
How to Test It:
Container-Based Full Website Kits, Templates and Blocks
As Flexbox Containers has been officially marked as a beta experiment, since Elementor 3.8, meaning you can confidently use them on your website, the Library team has been working tirelessly to provide you with Container-based website assets.
Now, when you activate the Flexbox Container experiment, you will notice that you’ve gotten a new library, made up entirely of container-based assets. This includes dozens of the most popular full website kits and page templates that have been converted from the section-column layout to the Flexbox Container layout, as well as brand-new Website Kits and page Templates.
With the new library, there are two additional noticeable changes. The first is that we introduced a new type of website kit – mini-shops, a one-page full website kit for ecommerce websites including PayPal and Stripe buttons for payment collection. The second is that all the previous Blocks (such as Contact, 404, etc.) have been replaced with completely new designs.
With the new, updated library, you will be able to kick-start your website creation and design process when enabling the Flexbox Container experiment, using the most up-to-date design trends. All the previous designs will still be available, if desired, by deactivating the Flexbox Container experiment (important note: deactivating the Flexbox Container experiment will remove all Containers and their content from your website).
How to Test It:
[Pro] Dynamic Due Date in Countdown Widget
The Countdown Widget, a great tool for creating FOMO and boosting conversion, is now getting a dynamic tag control for the due date. The due date in the Countdown widget allows you to set a specific date and time to count down to. With this update, you will be able to use native WordPress custom fields, as well as custom fields from ACF, and PODS to dynamically populate the due date.
With the dynamic due date, you will be able to use the Countdown widget anywhere on your website, or in a number of different pages, while managing the due date in a custom field in WordPress. This will allow you to make changes to the Countdown’s due date, across your website in one simple step.
How to Test It:
Disable Google Fonts
Google fonts, though a popular library for online fonts, exposes users to risk of violating GDPR and privacy regulation. To eliminate this risk, Elementor allows you to disable Google fonts from your website in a single click. When disabling Google fonts, you will no longer be able to use the online Google font library in the Editor, which will reduce the number of fonts available to you in the Editor to 7 fonts. If you’ve used Google fonts on your website, but choose to disable Google fonts from your website, all fonts on your website will default to one of the available fonts on your website.
If you are an Elementor Pro user, you will be able to continue using locally hosted fonts and adding them using the Custom Fonts feature.
How to Test It:
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:
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:
Designated time for release: January 2023 (Estimated)
Many thanks for your support and help!
This content was originally published here.