In a recent Business Bloomer Club Slack thread, a user shared a frustrating issue they faced while managing their WooCommerce account page built with Elementor Pro and Yoast SEO.
Typically, the WooCommerce account page allows customers to log in or register, displaying appropriate messages for failed login attempts. However, with this combination of plugins, users trying to log in saw no error messages if login failed.
This lack of feedback left users confused about why they couldn’t access their accounts, leading to unnecessary support requests and customer frustration. The cause of this issue is tied to compatibility challenges between WooCommerce, Elementor Pro, and Yoast, which interfere with error message visibility.
After thorough research, a solution emerged: using a custom shortcode to display login error messages on the WooCommerce account page, effectively restoring this essential functionality.
Adding a Custom Error Message Snippet for WooCommerce Account Pages
To resolve this, users can insert a custom code snippet into their theme’s functions.php file. This snippet captures error messages and displays them on the WooCommerce account page created with Elementor, ensuring users understand login issues:
// Add error message on login/register pages
$notices_backup = "";
function custom_print_errors($atts) {
global $notices_backup;
return $notices_backup;
}
add_shortcode("custom_print_errors", "custom_print_errors");
function my_woocommerce_add_error($error) {
global $notices_backup;
$notices_backup .= $error;
return $error;
}
add_filter('woocommerce_add_error', 'my_woocommerce_add_error');
Adding this code and then placing the [custom_print_errors] shortcode on the Elementor-designed account page enables the display of error messages, enhancing user experience and reducing confusion at checkout. This solution exemplifies how small code adjustments can resolve plugin compatibility issues, improving customer experience.
