Elementor includes a built-in and hassle-free integration to MailChimp, MailPoet, GetResponse, ConvertKit, Drip, ActiveCampaign, HubSpot, MailerLite, Slack, and Discord.
You can even integrate SalesForce via a Zapier premium subscription. In fact, you can connect your favorite email marketing service, CRM or any other Zapier integration with just a few easy steps.
For more information, check out the release post on the subject
Insert an 「Add To Cart」 button and control the layout and style of the Add to Cart button in the WooCommerce Single template
Style
Button
Alignment: Align the title to the left, right, center, or justifiedTypography: Change the typography options for the Add To Cart buttonBorder Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or groovedBorder Radius: Set the border radius to control corner roundnessPadding: Change the padding settings of the button
Normal | Hover
The following options can be set independently for both the normal and hover states.
Text Color: Choose the color of the button』s textBackground Color: Choose the background color of the buttonBorder Color: Choose the border color of the button
Quantity
Spacing: Adjust the amount of space between the Quantity field and the ButtonTypography: Change the typography options for the Quantity textBorder Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or groovedBorder Radius: Set the border radius to control corner roundnessPadding: Change the padding settings of the Quantity field
Normal | Focus
The following options can be set independently for both the normal and focus states.
Text Color: Choose the color of the Quantity』s textBackground Color: Choose the background color of the Quantity fieldBorder Color: Choose the border color of the Quantity field
Variations
Spacing: Change the amount of space between the variations and the Add To Cart buttonSpace Between: Change the amount of space between each variation
Label
Color: Choose the color of the Variations』 Label textTypography: Change the typography options of the Variations』 Label text
Select Field
Color: Choose the color of the Variations』 Select field textBackground Color: Choose the background color of the Variations』 Select fieldBorder Color: Choose the border color of the Variations』 Select fieldTypography: Change the typography options of the Variations』 Select fieldBorder Radius: Set the border radius to control corner roundness
Note: The style of this widget is often affected by your theme and plugins. If you experience any such issue, try to switch to a basic theme and deactivate related plugins, or adjust the styling within your theme』s settings.
We ♥ Gutenberg: Get Answers to All Your Questions Regarding Gutenberg & Elementor.
The new Gutenberg editor is here, and we know this is intimidating for many WordPress users. Gutenberg naturally raises questions and concerns, some directly related to Elementor.
In this doc, we want to help fill in all the blanks regarding Gutenberg, and how it is going to play out in relation to Elementor.
General Questions
What is Gutenberg?
Gutenberg is the replacement of the old Wysiwyg editor, allowing users for a much better writing experience when creating content on WordPress. This way, you can easily add image, videos, headlines, buttons and other elements besides your text. A post in Gutenberg is a collection of blocks, and this new structure is what makes it easier to create rich content in Gutenberg.
Does Gutenberg replace Elementor? What is the difference between them?
No, Gutenberg does not replace Elementor. While they share the fact that both are editors, there is a fundamental gap between them.
Elementor is a solution built for designers. If you need to design a website – use Elementor.
Gutenberg has been created in order to improve the user experience of the former WordPress editor, making it easier for bloggers and content writers to embellish their posts with images and other types of rich media.
Will I need to use Gutenberg once it is launched, or can I stick strictly to Elementor?
You can continue to use Elementor, just like you are used to.
What about the Classic WordPress editor?
If you are reluctant to use Gutenberg, you will still have the option to revert back to the previous editor. Having said that, we strongly encourage you use Gutenberg.
How does Gutenberg affect the future direction of Elementor?
We feel like Elementor played a part in substantiating the role of visual design in the experience of every WordPress user. This encourages us to continue to develop Elementor in the same direction we started, opening new realms of possibilities to design in WordPress, some never before seen.
Gutenberg-Elementor Integration
How will the two interfaces work together?
Elementor and Gutenberg already work seamlessly together. As a user, you can easily decide which editor you use at every point while editing your site.
Build a blog post layout in Elementor, then implement it, so every new post you write with Gutenberg automatically gets the design from Elementor. You can also easily embed Elementor blocks on any Gutenberg page.
Will I be able to use Elementor inside Gutenberg or vice versa?
Yes. Check out our Elementor Blocks for Gutenberg plugin in the WordPress repository.
Are Gutenberg blocks going to show up when I drag a Text widget into my page?
No. The text editor widget stays the same.
Will there be corrections in Elementor-built websites once Gutenberg is launched? Will I need to make updates to my pages?
No, there won』t be any changes. In terms of designing in Elementor, your sites and pages will remain the same, and you will be able to continue just where you left off.
Check out our blog post about WordPress 5.0, Gutenberg-Elementor integration and more:https://elementor.com/blog/welcome-wordpress-5-0/
Why use Elementor with PODS
PODS brings limitless possibilities for adding extra data to WordPress content by creating custom fields. Elementor allows you to dynamically insert the PODS custom field data directly into your Elementor designs with all the styling options you』ve come to expect from Elementor.
Note: 「Enable Archive Page」 should be checked in the Pods custom post type settings as shown below.
How To Add PODS Custom Fields To A Single Post Template
Go to Templates > Theme Builder > Single > Add NewChoose Template Type > Single. Name your template and click Create TemplateClick on the Document Settings gear icon located at the bottom left of the panelClick the Preview Settings tabUnder Preview Dynamic Content select the post type you wish to previewDrag a widget that makes use of dynamic content (e.g. Text widget)Click on the Dynamic icon Choose PODS FieldOnce selected, click again on PODS FieldIn Settings > Key, select the custom field you want to displayThe options in the Advanced tab are optional. Options include:Before: Text to automatically appear before the custom field dataFallback: Text to display if custom field has no dataAfter: Text to automatically appear after the custom field dataStyle the custom field widget as you would normally, using the widget』s Style tab.
Custom PODS fields we support:
Note: Any PODS fields not included in this list are not supported at this time
Text:
『text』, 『phone』, 『paragraph』, 『relationship (select)』, 『pick』, 』email』,』oembed』, 『google_address』, 『wysiwyg』
date:
『datetime』, 『date』
URL:
email』, 『file』, 『website』, 『phone』
Image: file:type-images
Image: File:type-images:multiple:true
Example of use
Pet Rescue Listings
A pet rescue website needs to list all pets available for adoption. Custom fields such as Breed, Age, and Size might be needed to accurately describe each animal. PODS makes it easy to create the custom fields, while Elementor brings the magic needed to beautifully display the data on the front end.
Sure you can!
Plugin widgets that appear in the WordPress widgets menu will also appear inside Elementor automatically.
Just drag and drop them onto the page.
Both Elementor and Elementor Pro use the language set in the WordPress admin.
Go to WordPress Dashboard > Settings > GeneralSelect your desired language from the dropdown of the Site Language option
Now, your WordPress admin and your Elementor and Elementor Pro frontend and backend will all be in the Site Language you』ve chosen.
Note: It is not possible to run Elementor or Elementor Pro in a different language from the one chosen in the WordPress settings.
Update your site』s translations after each update of Elementor
Updating Elementor does not automatically update the translation. When you switch the language from 」 Settings > General「, this changes the language of Elementor and Elementor Pro as well. But there is an additional step to take.
Go to 「Dashboard > Updates」 and accept the translation of Elementor Pro there by clicking the Update Translations button.
Note: After each update, there may be new strings to translate, so you should check the Dashboard > Updates panel after each Elementor update.
If you are interested in joining the team of localizers so you can help translate Elementor into your language, please read How To Translate Or Localize Elementor
Speed, intuitive UI, advanced design option, full control over your website. In fact, Elementor isn』t merely a page builder any longer. Elementor is a website builder.
We have put all our efforts, trying to excel in these fields.
The result is the best website builder choice for designers, developers and newbies alike.
Set the style and position of the Product Rating within the Single Product template
Style
Star Color: Choose the color of the filled starsEmpty Star Color: Choose the color of the empty starsLink Color: Choose the color of the link to customer reviewsTypography: Set the typography options for the customer reviews linkStar Size: Set the exact size of the starsSpace Between: Control the amount of space between the stars and the linkAlignment: Align the Product Rating widget to the left, right, center, or justified
Elementor and Cloudflare integrate smoothly with each other, although there has been an issue with Rocket Loader in the past.
The issue was caused by Rocket Loader automatically changing the scripts to load asynchronously, which breaks the editor.
If this is causing you a problem, you can solve this by creating rules in Cloudflare:
For Elementor pages: Site URL/*elementor*For Elementor templates: Site URL/?elementor_library=*
To learn more about rules in Cloudflare please check their official documentation here.
You can check the changelog of Elementor in the WordPress repository:https://wordpress.org/plugins/elementor/#developers
You can check the changelog of Elementor Pro: https://elementor.com/pro/changelog/
