What’s New in Elementor Pro 3.7- Stripe Button Widget, 100 Dynamic Tags, Notes and more

What’s New in Elementor Pro 3.7- Stripe Button Widget, 100 Dynamic Tags, Notes and more

The latest version of the Elementor Pro plugin has been released and in this article we have discussed what’s new in Elementor Pro 3.7.

Elementor Pro 3.7 update includes new features, widgets and improvements that will allow you to customize your Woocommerce store better and will ensure that visual appearance is consistent across the site.

On top of this new collaboration capabilities have been introduced to improve communication with clients and team members.

Keeping this in mind, it is important to know that this update is for the premium version of the plugin.

And this means, you will only get access to these features if you are using Elementor Pro or your site is hosted on Elementor Cloud (includes the Pro plugin).

In case you are not using this plugin and want to give it a try then you can do that by clicking the button below.

What’s new in Elementor Pro 3.7- New features, widgets and improvements

Elementor Pro 3.7 was released on 10th May 2022 and it is packed with features.

Below we have listed all the topics covered.

New Stripe button widget in Elementor Pro 3.7

If you have been using Elementor Pro then you must be familiar with the fact that until now it allowed you to accept payments using PayPal only.

In Elementor Pro 3.7, an alternative to PayPal which is the new Stripe button widget has been introduced and it will give you another way of receiving payments using Elementor easily.

You will find the new Stripe button widget under the Pro section in the Elementor side panel.

And on adding this widget to the Elementor canvas, it will show you all the settings along with the message to set Stripe API keys if haven’t done that yet.

You can add these keys by clicking the Integration Settings link in the message.

In case you are in your WordPress dashboard then you will have to head over to Integration tab om Elementor Settings.

And you will find the option to add Stripe API keys in Elementor at the very bottom.

Now coming to the settings of the new Stripe button.

You get acess to all the necessary options from Product Name to selecting currency to setting product price, shipping price and more.

On top of this Elementor Pro lets you customize the button label, set its alignment, change / add icon and more.

Also, under the Additional options, Elementor allows you to add a custom thank you page that you can redirect users to after a successful purchase.

As far as the styling options are concerned, just like any Elementor widget you get complete control and it lets you change / customize, for both the Stripe button and error messages.

Below we have shared a few options that you will find

• Typography
• Button color
• Add border
• Text color
• Box shadow
• Padding
• Error message color

And more.

Basically you will get all the customization options that are available for buttons and you will find these under the Style tab of the new Stripe button widget.

Improvements to Woocommerce widgets in Elementor Pro 3.7

As discussed above, Elementor Pro 3.7 update is packed with new features and improvements and in this section we will be covering all the changes that you will come across in the Woocommerce widgets.

Changes to Woocommerce Product widget in Elementor Pro 3.7 update

Elementor’s Product widget lets you showcase products on any page of site and you can customize every aspect of it easily.

In Elementor Pro 3.7 update, there are quite a few changes that have been released for this widget and the first improvement that we are going to discuss is the

Introduction of new queries

There are 3 new queries that have been introduced in Product widget in the Elementor Pro 3.7 update. These are

• Related products- Lets you add related products
• Upsells- Lets you add a product for upselling
• Cross selling- Lets you cross promote products

First things first, you will find the new queries in the Source dropdown inside the Query tab of the Elementor Pro Product widget.

These queries will make your life much easier as these have the exact same functionality as Product Related and Upsell widgets.

This means you can use these new Product widget queries instead of individual widgets itself.

In case you are wondering if you will be able to use the Related Product and Upsell widget then the answer is YES.

You can continue to use these widgets where ever required.

New Automatically Align Button option

If you have been creating Woocommerce sites using Elementor then you must be familiar with the fact that at times in Product showcases the add to cart button do not align with each other.

See the below screenshot for reference

This is a common situation that almost everyone faces and there was no easy way to resolve this before Elementor Pro 3.7.

In this version of the plugin, a new option called Automatically Align buttons has been added using which you will be able to do this in just one click.

You will find this option in the Style tab of the Elementor Product widget.

Control spacing between Add to Cart button and View Cart link

While we are on the topic of new style option in the Product widget, it is important to know that another new setting has been introduced that will allow you to add spacing between Add to Cart button and View Cart link.

You will find this option in the Style tab of the Elementor Pro Product widget.

Improvements to Cart widget in Elementor Pro 3.7

Cart widget was introduced in Elementor Pro 3.5 and it allowed you to create a custom cart page for your Woocommerce store.

In Elementor Pro 3.7 update, this widget has received quite a few improvements and the first one is

Show / Hide coupon option

If you have been using the Elementor Pro cart widget then you must have seen that before Elementor Pro 3.7, it only allowed you to change the text on button.

And there was no option available to completely remove it.

This has changed in Elementor Pro 3.7 update and now you will be able to display or remove coupon code section with just one click.

You will find this option in the Coupon tab when you add Cart widget on the Elementor canvas.

Alignment options for buttons

The second improvement that you will see in the Cart widget is the addition of alignment options for various buttons such as

• Coupon

• Update shipping

You will find these alignment options under their respective tabs when you add Cart widget to Elementor canvas.

Empty Cart option

The last and final improvement that has been introduced in the Cart widget is the Customize Cart widget option.

What this option does is it allows you to display a custom template instead of the empty cart screen.

You can use this option creatively to boost sales.

Keeping this is mind, you will find the Customize Empty Cart option un the Additional Options tab when you add the Cart widget.

This option is disabled by default and to enable it you will have to click the toggle button.

Once active, it will show you the option to choose a template and you can do that by using the dropdown / search box.

On selecting a template click Update and it will display the selected template instead of the empty cart page.

Changes to Checkout widget in Elementor Pro 3.7

Just like the Cart widget, checkout widget lets you create a custom Checkout age for your Woocommerce site.

And in Elementor Pro 3.7 update, there are a few improvements that have been released for this widget.

Show/ Hide coupon

The first change that you will see in the Checkout widget is the introduction of a new option to enable or disable coupon section in the checkout widget.

You will find this option under the Coupon tab when you add Checkout widget on Elementor canvas.

It is important to know here that you will find this option in the Cart widget as well and it is up to you whether you want to activate this option on either of these pages or both.

Coupon button alignment

The next change that you will notice in the Checkout widget is the alignment option for Apply button.

Using this you can adjust the alignment of the coupon button on the checkout page.

You will find this option in the coupon tab under the Apply button heading.

New option to customize dashboard in My Account widget

If you are looking to create a custom My Account page for your Woocommerce site then Elementor’s My Account widget is for you.

In Elementor Pro 3.7, this widget has received an update where it now lets you display a custom template instead of the default dashboard screen.

You will find this new Customize Dashboard option under the Additional Options tab when you use My Account Widget.

As you can see, this option is disabled by default and to display a custom template, you need to enable it by clicking the toggle button.

And on doing this, it will show you a dropdown / search using which you can choose a template.

Once you have selected a template, click Update to save the changes and now it will display a custom template instead of default dashboard screen.

Custom Icons for dropdown in Navigation widget

In Elementor Pro 3.7 update, Navigation widget has received an improvement where you will be able to choose a custom icon for navigation dropdown.

As this option was not available in versions of Elementor Pro before 3.7, you has to settle for the default hamburger icon.

See the screenshot below for reference

This has changes in Elementor Pro 3.7 and now you will be able to select a custom icon for Navigation dropdown for both Normal and Active states.

It is important to know that here Elementor Pro allows you to upload custom SVG as well.

Improvements to Posts widget in Elementor Pro 3.7 update

In Elementor Pro 3.7, Posts widget has received 2 updates. Below we have discussed both.

Option to automatically align button

If you are looking to display a list of any post type on a page then Posts widget is for you.

When using this widget you must have faced a minor issue where at times the read more button does not align with each other.

This is a common problem and a permanent solution to this has been introduced in Elementor Pro 3.7 update. which is the Automatically Align Button option.

On activating this, it will automatically align all buttons towards the bottom.

Apply to Custom Excerpt

The second change that has been introduced in the Posts widget is the Apply to Custom Excerpts option.

If you have been using the Posts widget then you must be familiar with the Set Custom Excerpt length feature.

This feature allows you to control the length of the Excerpt to be displayed.

It is important to know here that if you have set custom Excerpt in Post then this setting will have no impact.

To solve this problem, in Elementor Pro 3.7 update a new Apply to Custom Excerpt has been introduced using which you can limit custom excerpt length for posts.

This option is disabled by default and to activate it you will have to click the toggle button.

Please note– You will find both of these settings in Elementor Pro’s Archive Posts widget as well.

Introduction on LazyLoad in Media Carousel, Reviews and Testimonial Carousel widget

In Elementor 3.7, Lazy load option has been introduced in

• Media Carousel

• Reviews

• Testimonial Carousel

Using Lazyload you can optimize the performance of these widgets in just one click.

You will find Lazy load in the Additional Options tab of these Elementor Pro widgets.

Minimize Table of Contents on Desktop in Elementor Pro 3.7

If you have been using Elementor’s Table of Content widget then you must be familiar with the fact that it gives you the option to minimize it by default on Mobile and Tablet.

And there is no option available to minimize on desktop by default. See the below screenshot for reference.

This has changed in Elementor Pro 3.7 update and a new option for minimizing table of content on desktop by default has been added.

Now if you are looking to add a Table of content on a page or post and want it start collapsed then all you have to do is select Desktop (or smaller) option in the Minimize on dropdown.

100 new dynamic tags in 24 widgets

Elementor Pro gives you an easy way to personalize experiences for users and this is done using Dynamic tags.

And it is a creative way to boost engagement on your site.

Keeping this in mind, in Elementor Pro 3.7, 100 new Dynamic tag fields have been introduced across 24 widgets.

Below is the complete list.

Introduction of Notes in Elementor Pro 3.7 update

In Elementor Pro 3.7, a new feature called Notes has been introduced using which you can collaborate and communicate with your team members and clients easily.

On top of this you can use this feature to receive feedback or share updates on projects as well.

You will find the Notes option on a few places in your site.

• WordPress admin bar

• Hamburger menu in Elementor canvas

To add notes using this feature all you have to do is click Notes and it will open the notes panel.

In the next step you need to click an element / section and a box will appear which will allow you to type in your message or feedback.

On adding, it will show you the message like the screenshot below

It is important to know that in Notes, Elementor gives you the option to edit, delete, copy link and more.

Having said that,

This concludes everything you need to know about the Elementor Pro 3.7 update. In case you are not using this plugin and want to give it a try then you can do that by clicking the link below.

Get started with Elementor Pro 3.7

To get started with Elementor Pro 3.7, the first step is to visit Elementor and the click Pricing on the main navigation.

Doing this will take you to the pricing page where you will see 2 website creation paths- Website Builder + Hosting which is the Cloud Website and Website Builder which is the Pro Plugin.

If you are looking for a reliable web hosting to start your site then Elementor’s Cloud Website plan is for you.

It is an end to end hassle free website creation platform that takes care of all the technical side of things and includes the pro version of the plugin, a generous web hosting plan and a lot more.

To sign up with Elementor Cloud, you need to scroll down a little and click Buy Now. Doing this will take you to the checkout page where you will have to provide some basic information and pay.

In case you are just looking to buy Elementor Pro plugin then you will have to select Plugin as the website creation path and it will show you all the Elementor Pro plans.

Here you will have to select one as your requirements and it will take you to the checkout page where you will have to create an account on Elementor first and then pay

And that’s it now you have the latest version of the Elementor Pro plugin. The next step requires you to download and install it on your site.

Elementor Pro 3.7 Update- Video

Having said that,

I hope you will find this article helpful and now know all about the Elementor Pro 3.7 update.

In case you have any queries then feel free to reach out.

To stay up to date with our content we recommend subscribing to our YouTube channel and email list. Also, don’t forget to join our Facebook community.