When using Elementor forms to send email notifications, the [all-fields] shortcode is a convenient way to include all form data in the email. However, there is no option to customise Elementor Forms Confirmation Email Formatting by default, the output is plain and uses <br> tags to separate fields, which can make the email look messy and unprofessional. In this article, we’ll show you how to create a custom email action for Elementor forms to format your emails in a more structured and stylish way using a table layout.

This solution is update-safe and allows you to customize the recipient, sender name, sender email, and subject directly in Elementor’s form widget settings.

Why Customize Elementor Forms Emails?

Elementor forms are a popular choice for building forms on WordPress websites. However, the default email formatting using [all-fields] can make it difficult to create professional-looking email notifications. A custom email action provides more control over the email format and layout, making your emails easier to read and more visually appealing.

Customizing the Elementor forms email format can significantly enhance how you present form submissions. Using a custom plugin or code snippet, you can improve the formatting of your Elementor forms all fields email output by replacing default tags with a professional HTML table layout.

Code to Implement a Custom Email Action in Elementor Forms

Below is the full code to add a custom email action in Elementor forms. You can copy and paste this code into your theme’s functions.php file or a custom plugin to create a more structured Elementor forms email format.

add_action('elementor_pro/init', function () {
    class Formatted_Email_Action extends \ElementorPro\Modules\Forms\Classes\Action_Base {
        public function get_name() {
            return 'formatted_email';
        }
 
        public function get_label() {
            return __('Formatted Email', 'elementor-pro');
        }
 
        public function run($record, $handler) {
            $form_data = $record->get('fields');
 
            // Build custom email table
            $email_table = '<table style="border-collapse: collapse; width: 100%; border: 1px solid;">';
 
            foreach ($form_data as $field) {
                $email_table .= '<tr>';
                $email_table .= '<td style="border: 1px solid; padding: 8px;"><strong>' . esc_html($field['title']) . '</strong></td>';
                $email_table .= '<td style="border: 1px solid; padding: 8px;">' . esc_html($field['value']) . '</td>';
                $email_table .= '</tr>';
            }
 
            $email_table .= '</table>';
 
            // Get form settings
            $settings = $record->get('form_settings');
 
            // Defaults that make sense universally
            $to_email = !empty($settings['formatted_email_to']) ? $settings['formatted_email_to'] : get_option('admin_email');
            $from_email = !empty($settings['formatted_email_from']) ? $settings['formatted_email_from'] : 'noreply@' . parse_url(home_url(), PHP_URL_HOST);
            $from_name = !empty($settings['formatted_email_from_name']) ? $settings['formatted_email_from_name'] : get_bloginfo('name');
            $subject = !empty($settings['formatted_email_subject']) ? $settings['formatted_email_subject'] : __('New Form Submission', 'elementor-pro');
 
            // Send custom email
            wp_mail(
                $to_email,
                $subject,
                $email_table,
                [
                    'Content-Type: text/html; charset=UTF-8',
                    'From: ' . $from_name . ' <' . $from_email . '>'
                ]
            );
        }
 
        public function register_settings_section($widget) {
            $widget->start_controls_section(
                'section_formatted_email',
                [
                    'label' => __('Formatted Email Settings', 'elementor-pro'),
                    'condition' => [
                        'submit_actions' => $this->get_name(),
                    ],
                ]
            );
 
            // Email To
            $widget->add_control(
                'formatted_email_to',
                [
                    'label' => __('To Email', 'elementor-pro'),
                    'type' => \Elementor\Controls_Manager::TEXT,
                    'default' => get_option('admin_email'),
                    'placeholder' => __('Enter recipient email...', 'elementor-pro'),
                ]
            );
 
            // From Email
            $widget->add_control(
                'formatted_email_from',
                [
                    'label' => __('From Email', 'elementor-pro'),
                    'type' => \Elementor\Controls_Manager::TEXT,
                    'default' => 'noreply@' . parse_url(home_url(), PHP_URL_HOST),
                    'placeholder' => __('Enter sender email...', 'elementor-pro'),
                ]
            );
 
            // From Name
            $widget->add_control(
                'formatted_email_from_name',
                [
                    'label' => __('From Name', 'elementor-pro'),
                    'type' => \Elementor\Controls_Manager::TEXT,
                    'default' => get_bloginfo('name'),
                    'placeholder' => __('Enter sender name...', 'elementor-pro'),
                ]
            );
 
            // Email Subject
            $widget->add_control(
                'formatted_email_subject',
                [
                    'label' => __('Email Subject', 'elementor-pro'),
                    'type' => \Elementor\Controls_Manager::TEXT,
                    'default' => __('New Form Submission', 'elementor-pro'),
                    'placeholder' => __('Enter email subject...', 'elementor-pro'),
                ]
            );
 
            $widget->end_controls_section();
        }
 
        public function on_export($element) {
            return $element;
        }
    }
 
    // Register the new custom action
    \ElementorPro\Plugin::instance()->modules_manager->get_modules('forms')->add_form_action('formatted_email', new Formatted_Email_Action());
});

How the Code Works

• Custom Action Class: The code creates a new class called Formatted_Email_Action that extends Action_Base.
• get_name(): Defines the action name as formatted_email.
• get_label(): Provides a label for the action that appears in the Elementor form widget settings.
• run(): The core function that handles the custom email logic. It builds an HTML table for the email content, retrieves the form settings, and sends the email using wp_mail().
• register_settings_section(): Adds new settings to the Elementor form widget for configuring the email recipient, sender name, sender email, and subject.

How to Use the Custom Action in Elementor

1. Add the code to your theme’s functions.php file or a custom plugin.
2. Edit your form in Elementor.
3. In the Actions After Submit section, select Formatted Email.
4. Configure the email recipient, sender name, sender email, and subject in the new settings section.

Benefits of Formatting Elementor Forms Email

• Customizable Layout: The email is formatted using an HTML table, making it more visually appealing.
• Update-Safe: This method doesn’t modify Elementor’s core files.
• Easy to Use: The custom action appears as a selectable option in the Elementor form widget settings.

By implementing this Elementor forms email format plugin approach, you can ensure a professional and organized email output from your forms.

Conclusion

By creating a custom email action for Elementor forms, you can significantly improve the appearance and readability of your form submission emails. This solution gives you complete control over the Elementor forms all fields email formatting while keeping the process simple and update-safe.

With this approach, you can say goodbye to messy emails and ensure your notifications look professional every time.

Keywords: Elementor Forms, Elementor Forms Format Email, Elementor Forms All Fields Email Formatting, Elementor Forms Email Format Plugin, Elementor Forms Confirmation Email Formatting