If you are experiencing a 404 error when using Elementor on specific pages of your WordPress website, there are a few possible causes for this issue. One common reason is that the page you are trying to edit with Elementor does not exist or has been deleted. Another possibility is that there is a conflict between Elementor and another plugin or theme on your site.
To troubleshoot and fix this issue, you can try the following steps:
Check if the page exists: Verify that the page you are trying to edit with Elementor actually exists. Go to your WordPress dashboard and navigate to “Pages” to see if the page is listed. If it is not there, you will need to recreate the page or restore it from a backup.
Disable other plugins: Temporarily deactivate all other plugins on your site except for Elementor. This will help determine if there is a conflict between Elementor and another plugin. If the 404 error disappears after deactivating the plugins, you can then reactivate them one by one to identify the conflicting plugin.
Switch to a default theme: Temporarily switch to a default WordPress theme, such as Twenty Twenty-One. This will help determine if the issue is caused by your current theme conflicting with Elementor. If the 404 error is resolved with the default theme, you may need to contact the theme developer for assistance or consider using a different theme.
If none of the above steps resolve the issue, you can try using the following code snippet to disable Elementor on specific pages:
function wpsnippets_disable_elementor_on_specific_pages() {
if ( is_page( array( 'page1', 'page2' ) ) ) {
add_filter( 'elementor/theme/builder/active', '__return_false' );
}
}
add_action( 'template_redirect', 'wpsnippets_disable_elementor_on_specific_pages' );
In this code snippet, we are using the template_redirect action hook to check if the current page is one of the specified pages (e.g., ‘page1’, ‘page2’). If it is, we add a filter to disable Elementor’s builder functionality by returning false for the elementor/theme/builder/active filter.
You can modify the array( 'page1', 'page2' ) part of the code to include the slugs or IDs of the specific pages where you want to disable Elementor. Once you have added this code to your theme’s functions.php file or a custom plugin, Elementor will be disabled on the specified pages, preventing any potential conflicts or errors.
Examples
Example 1: Exclude specific pages from Elementor 404 error handling
This use case demonstrates how to exclude specific pages from Elementor’s 404 error handling. By default, Elementor handles 404 errors for all pages, but sometimes you may want to exclude certain pages from this behavior. The code example below shows how to achieve this by adding a custom PHP function to your theme’s functions.php file.
function wpsnippets_exclude_elementor_404_handling( $is_elementor_404 ) {
if ( is_page( array( 'about', 'contact' ) ) ) {
$is_elementor_404 = false;
}
return $is_elementor_404;
}
add_filter( 'elementor_is_404', 'wpsnippets_exclude_elementor_404_handling' );
This code uses the elementor_is_404 filter hook to modify the behavior of Elementor’s 404 handling. The wpsnippets_exclude_elementor_404_handling function checks if the current page is either the “about” or “contact” page, and if so, it sets the $is_elementor_404 variable to false, indicating that Elementor should not handle the 404 error for these pages.
Example 2: Customize Elementor’s 404 error message
In this use case, we’ll customize the 404 error message displayed by Elementor. By default, Elementor shows a generic message when a page is not found. The code example below demonstrates how to change this message by adding a custom PHP function to your theme’s functions.php file.
function wpsnippets_custom_elementor_404_message( $message ) {
$message = 'Oops! The page you are looking for could not be found.';
return $message;
}
add_filter( 'elementor_404_message', 'wpsnippets_custom_elementor_404_message' );
This code uses the elementor_404_message filter hook to modify the default 404 error message. The wpsnippets_custom_elementor_404_message function simply returns the desired custom message, which will be displayed instead of the default message.
Example 3: Redirect Elementor 404 errors to a specific page
In this use case, we’ll redirect Elementor’s 404 errors to a specific page of your choice. Instead of showing the default 404 error page, you can redirect users to a different page within your WordPress site. The code example below demonstrates how to achieve this by adding a custom PHP function to your theme’s functions.php file.
function wpsnippets_redirect_elementor_404( $url ) {
if ( is_404() && function_exists( 'elementor_can_edit_post' ) && elementor_can_edit_post() ) {
$url = home_url( '/custom-page/' );
}
return $url;
}
add_filter( 'elementor_404_redirect_url', 'wpsnippets_redirect_elementor_404' );
This code uses the elementor_404_redirect_url filter hook to modify the URL to which Elementor’s 404 errors should be redirected. The wpsnippets_redirect_elementor_404 function checks if the current page is a 404 error page and if Elementor can edit the post. If both conditions are met, it sets the $url variable to the desired custom page URL using the home_url() function.