What’s New in Elementor 3.13 Update
Want to know what’s new in Elementor 3.13?
If yes then in this article we have shared everything you need to know about this update.
First things first, Elementor 3.13 update is for the free version of the plugin.
And this means anyone using the free Elementor plugin will get access to the new features and improvements.
As far as the new features and improvements are concerned, Elementor AI along with CSS Grid has been introduced.
Apart from this, Editor Top bar and Color picked have been improved.
Keeping this in mind, if you are looking to get started with Elementor then you can do so by clicking our SPECIAL LINK or the button below.
Elementor 3.13 Update
Before we learn more about Elementor 3.13, it is important to know that this update was released on May 08 2023.
And below are the topics covered.
Elementor AI Write
The first new feature that has been introduced in Elementor 3.13 is the Elementor AI Write.
Elementor AI Write is the first version of Elementor AI and it comes integrated within the editor.
And using it you can generate text and code by typing in a prompt.
As it comes integrated in the Elementor editor, you will find it in widgets that allow you to add text and code such as
- Heading
- Text Editor
- Button
- Icon List
- HTML
And more.
As you can see in the screenshot above, you will find the option to use Elementor AI in front of the Text label.
And on clicking Write with AI, a modal will appear where you will have to accept the terms first and then click Get Started.
Doing this will open a popup where you can add a prompt and click Generate Text.
Clicking Generate Text will generate a heading in this case for you and you will get the option to
- Simplify Language
- Make it Longer
- Make it Shorter
- Fix Spelling and Grammar
Additionally, you will be able to change tone and translate it as well.
Once you are satisfied, click Use Text and it will insert the text.
Before we move forward, it is important to know that if you have a Elementor Pro license then you will be able to generate custom code and CSS using this feature as well.
You will find Elementor AI option when adding custom code.
And for Custom CSS you will find it in the Custom CSS tab under Advanced in a widget.
Again if you are looking to use Custom CSS and Code in Elementor then you will need a Pro subscription and you can get it by using our SPECIAL LINK.
Another thing that you will have to keep in mind here is that Elementor AI us available for free as a trial right now.
And to use it you will have to create an account on Elementor.
In case you want to upgrade and get unlimited access to Elementor AI then it will be billed at $35.88 / year which is very affordable and you can use our SPECIAL LINK for this.
CSS Grid in Elementor 3.13
If you have been using Elementor then you must be familiar with the fact that in version 3.6, Flexbox Container was introduced as an Experiment.
This feature comes disabled by default and to use it you will have to activate Elementor flexbox container.
An important thing that you need to know here is that on enabling it, you won’t be able to use sections and columns.
Or in other words, you won’t find inner section widget in Elementor editor as it will be replaced by Container.
Keeping this in mind, in Elementor 3.13, the container widget has received an improvement as CSS Grid has been added to it.
To see this change, the first step is to activate Grid Container feature in Elementor.
And for this you will have to navigate to Elementor Settings in your WordPress dashboard and under Features in ongoing experiments you will find Grid Container.
As you can see Grid Container is a feature that comes disabled by default and it requires Flexbox Container to be active.
Once you have activate Flexbox Container, the next step is to enable Grid Container
And for this you will have to select Active in the dropdown and then Save Changes.
Doing this will activate this feature.
In the next step, you need to edit a post with Elementor or add a new one and it will take you to the Elementor editor.
Here you need to add the container widget and under layout you will come across a new dropdown known as Container layout.
In this dropdown, you will have to select Grid to use CSS Grid in Elementor.
On selecting Grid, it will show you all the related settings such as
- Grid Outline
- Column and Rows
- Gap
- Justify Items
- Align Items
And more.
Now, in case you want to make a Grid Container clickable then you need to navigate to Additional options tab.
And you will have select a (link) in the dropdown.
And it will show you the option to add a link.
Once done you need to save the changes.
As far as the Style Settings are concerned, you will find them under the Style tab.
Top bar Enhancements
Moving on from the Grid Container, the next improvement that has been introduced in Elementor 3.13 is for the top bar.
Editor top bar is a feature that was introduced in Elementor 3.12 and it consolidates all the common actions you need to perform on your site.
This feature comes disabled by default and to see the improvements you will have to activate Editor Top Bar feature in Elementor.
For this you need to navigate to Feature tab in Elementor settings and under Ongoing Experiments you will find Editor Top Bar.
Here you will have to select Active in the dropdown and then Save Changes.
Doing this will enable top bar in Elementor editor.
Now coming to the changes,
The first improvement that you will come across in the Editor Top Bar is the addition of Page Navigation.
Using this option, you will be able to browse / visit latest 5 website parts such as
- Pages
- Posts
- Popups
- Theme Parts
And more.
See the screenshot below for reference
- Before Elementor 3.13
- After Elementor 3.13
As you can see, these parts appear as a dropdown and on clicking it will take you there.
The next improvement that you will come across in the Editor Top Bar is the addition of
- Display Conditions
- Triggers
- Advanced Rules
And more in Save options / Publish button.
See the below screenshot for reference
- Before Elementor 3.13 update
- After Elementor 3.13 update
It is important to know that these options are generally available when creating popups using Elementor.
And in case you want to use this feature then you will need a Pro or Elementor Cloud subscription.
And you can get it using our SPECIAL LINK.
Color Picker in Elementor 3.13
After the Editor Top Bar, the next change that you will come across in Elementor 3.13 update is for the color picker.
And in this, RGBA and HSLA types have been added to it.
See the below screenshot for reference
- Before Elementor 3.13
- After Elementor 3.13
To select RGBA or HSLA values, all you have to do is click the option in the color picker.
Other changes in Elementor 3.13 update
- Pickr Library updated to v1.8.0
- eicons Library updated to v5.20.0
This concludes everything you need to know about the Elementor 3.13 update.
If you have liked what you have read and want to upgrade to Elementor then you can do so by clicking our SPECIAL LINK or the button below.
Elementor 3.13 pricing
Now that you are familiar with Elementor 3.13 update, the next topic we are going to discuss is Elementor Pro 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
- 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 Elementor Pro costs, the next step is to buy Elementor Pro
Before we move forward, it is important to know that if you are just getting started and are looking for a reliable web hosting for your Elementor site then Elementor Hosting is for you.
Elementor WordPress Hosting or Elementor Cloud Website is a one stop platform using which you can build your site from scratch.
It has 4 plans and using our SPECIAL LINK you can claim Elementor Cloud Website discount
- Basic- $9.99
- Business- $19.99
- Grow- $22.99
- Scale- $49.99
What’s included
- Hosting powered by Google Cloud Platform
- Free SSL
- CDN from Cloudflare
- Free custom domain connection
- 100+ pre-designed websites
- Hello theme and WP pre-installed
- Automatic Backups
- Drag-and-drop, no code editor
- Staging Environment
- Premium support
And more
See- How to sign up for Elementor Cloud Website subscription
Elementor 3.13
Having said that,
I hope you will find this article helpful and are now familiar with what’s new in Elementor 3.13.
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.