What’s New in Elementor 3.10 Update
Elementor has released an update for the free version of its website builder plugin.
And in this article we have discussed what’s new in Elementor 3.10.
In this update of the Elementor page builder plugin, the Tab widget has been renewed.
On top of this new Container based assets have been released.
Keeping this in mind, if you are looking to give Elementor 3.10 a try then you can do so by clicking our SPECIAL LINK or the button below
Elementor 3.10 Update
Before we learn more about Elementor 3.10, it is important to know that- this update was released on January 9th 2023.
And below are the topics covered.
New Nested Elements Experiments
In Elementor 3.10, a new was of creating designs or using elements has been introduced.
And it is known as Nested Elements.
As the name suggests, this feature will allow you to place an element inside of another by leveraging the power of flexbox container.
This means to use Nested Elements you will have to activate Flexbox Container experiment in Elementor first.
It is important to know that Flexbox Container was introduced as an experiment in Elementor 3.6 and its status was updated to Beta in Elementor 3.8.
In Elementor 3.10, it is officially declared as stable.
Keeping this in mind, once you have enabled Flexbox Container, the next step is to activate Nested Elements experiment.
For this you will have to navigate to Experiments tab in the Elementor settings in your WordPress dashboard.
And then select Active in the Nested Elements dropdown and Save changes.
As of now, Nested Elements experiment comes disabled by default and its status is Alpha.
Before we move forward, it is important to know that we suggest that you try this feature on a local / development environment.
And not on a LIVE / production site.
Also, for right now Nesting feature is only available in Tabs widget and in future it will be introduced in other widgets such as Carousel, Accordion and more.
Renews Tabs Widget in Elementor 3.10
Once you are done enabling Nested Elements in Elementor, the next topic we are going to discuss is the new and improved Tab widget.
First things first, if you have been using Tabs widget then the previous use cases won’t be impacted by this change.
Also, as of now there is no option available to update from the old to the new Tabs widget.
However, when editing old Tabs widget it will show you a notification letting you know that you are editing the old version.
And now when you will add Tabs widget it will have improved capabilities.
Please note- This notification will only be visible if you have Nested Elements experiment active.
Keeping this in mind, on adding the new Tabs widget you will see quite a few differences and below we have shared a few.
Layout
The first difference that you will notice is the blank canvas inside of each of the tabs that looks exactly like the editor.
Here you will be able to add widget(s) as per your requirements.
Tabs
The second change / improvement that you will come across is in the content settings of this widget.
And here you will now be able to add icon to title in Tab widget.
You will see this option on clicking any of the Tab items.
Responsive settings
The next change that you will notice is a new tab known as Responsive Settings in the new Tabs widget.
And here you will be able to choose a breakpoint at which the Tabs will switch to an accordion.
In this dropdown you will have 3 options
- Mobile (>767px)
- Tablet (>1024px)
You can pick one based on your needs.
Before we move forward, it is important to know that if you are using additional breakpoints or have set custom values then those will be shown in this dropdown.
Custom Breakpoints is a feature that was released in Elementor 3.4 and you can change it by visiting Layouts in Elementor Site Settings.
Custom Size Units
If you have been using Elementor then you must be familiar with the fact that you can select size units (px, em, rem, %) based on your needs.
And these size units can be found in almost all settings (general or widgets) where you can add numeric values.
Keeping this mind, until now, Elementor only allowed you to choose a single size units and there was no way to use a mix.
This has changes in Elementor 3.10 and now you will be able to use multiple or a mix of size units.
To see this improvement, you can navigate to Advanced tab of any widget and then click size units option on Margin or Padding.
Doing this will show you all the size units and here you will have to select Custom by clicking the pencil icon.
Once done, you can enter values followed by the size unit. See the below screenshot for reference.
It is important to know that in Elementor 3.10, below mentioned sizing controls now have custom controls
- Containers, Sections and Columns
- Typography controls- Line Height, Letter Spacing and Word Spacing.
In the coming released other areas will be updated.
CSS Math Functions in Elementor 3.10
While we are on the topic of custom size units, in addition to using mix of size units, you will be able to perform calculations inside the fields for measuring values.
For this you will have to select custom size units and then add any of CSS Math function in the field. See the below screenshot for reference
This is a very welcome improvement in Elementor 3.10 update.
Disable Google Fonts
In early 2022, a German court found Google Fonts in violation of GDPR and its usage exposing websites to fines.
To eliminate any such risk, Elementor has introduced this option to completely disable Google Fonts.
You will find this option in Elementor Settings under Advanced tab in your WordPress dashboard.
Now to disable Google Fonts in Elementor, you will have to select Disable in the dropdown and save changes.
On doing so, the number of fonts available in the editor will come down to only 7.
And if you are using Google Fonts then all of the instances will default to one of the available ones.
Now, in case you are looking to use this font still then you can upload custom fonts in Elementor easily.
It is important to know that Custom Fonts is a feature that is available in the premium version and this means to use you will have to upgrade to Elementor Pro.
Preload attribute for Self Hosted videos
Preload is an attribute that conveys to the browser how a video needs to be loading on page load.
It has 3 values
- auto- Load entire video
- metadata- Load only metadata
- none- should not load video.
This attribute has been added to self hosted videos in Elementor 3.10 and you will find it in the content settings of the video widget.
It is important to know that if you have have Autoplay then this option will not be visible.
Hence, if you want to use this attribute then you will have to disable Autoplay in Elementor video widget.
Other Improvements in Elementor 3.10
- Added loading=”lazy” to Google Map widget
- Added loading=”lazy” to Image widget
This concludes everything you need to know about Elementor 3.10 update.
If you have liked what you have read and want to try Elementor then you can do so by clicking our SPECIAL LINK or the button below
Elementor 3.10 pricing and plans
Now that you are familiar with Elementor 3.10, the next topic we are going to discuss is its pricing and plans.
Elementor has 4 plans
- Essential (1 site)- $59
- Advanced (3 sites)- $99
- Expert (25 sites)- $199
- Agency (1000 sites)- $399
What’s included in Elementor 3.10
- 100+ Basic & Pro Widgets
- 300+ Basic & Pro Templates
- Theme Builder
- WooCommerce Store Builder
- Landing Page Builder
- Pop up Builder
- Form Builder
- Marketing Tools
- Premium Support
And more
Now that you are familiar with the Elementor 3.10 plans, the next step is to buy Elementor Pro and for that you will have to
- Create an account on Elementor
- Get Elementor Pro license
- Download Elementor Pro
- Install Elementor Pro
- Activate Elementor Pro license
Before we move forward, it is important to know that if you haven’t yet started and looking for a reliable web hosting for your Elementor site then you can sign up with Elementor Cloud Website.
Elementor Cloud is an all-in-one-platform using which you can build your site from scratch using Elementor easily.
It includes everything you need to get your site up an running.
And the best part is it takes away all the technical hassle and is priced at $99.
What’s included
- Hosting powered by Google Cloud Platform
- SSL & CDN from Cloudflare
- Monthly Visits: 100K
- Bandwidth/month: 100GB
- Storage: 20GB
- Free custom domain connection
- 100+ pre-designed websites
- Hello theme and WP pre-installed
- Drag-and-drop, no code editor
- Premium support
And more
To know more about this you can read – Frequently asked questions about Elementor Cloud Website
Elementor 3.10
Having said that,
I hope you will find this article helpful and are now familiar with what’s new in Elementor 3.10 update.
In case you have any queries feel free to get in touch.
To stay up to date with our content we recommend you subscribe to our YouTube channel and email list.
Also, don’t forget to join our Facebook group.