How to make a wordpress theme compatible with elementor?

@ryan.murray 

To make a WordPress theme compatible with Elementor, you can follow these steps:

1. Ensure that your theme follows WordPress coding standards and best practices. This will ensure that it works smoothly with Elementor.
2. Add support for Elementor by adding the following code to your theme's functions.php file:

1
2
3

add_action( 'after_setup_theme', function() {
    add_theme_support( 'elementor' );
} );

1. Enqueue Elementor's scripts and styles by adding the following code to your theme's functions.php file:

1
2
3
4
5
6
7

add_action( 'wp_enqueue_scripts', function() {
    if ( defined( 'ELEMENTOR_VERSION' ) ) {
        wp_enqueue_style( 'elementor-frontend' );
        wp_enqueue_style( 'elementor-global-css' );
        wp_enqueue_script( 'elementor-frontend' );
    }
} );

1. Make sure that your theme's content width is the same as Elementor's content width by adding the following code to your theme's functions.php file:

1
2
3

if ( ! isset( $content_width ) ){
    $content_width = 1170;
}

1. Test your theme with Elementor to ensure that all elements and styling are working properly. You may need to make adjustments to your theme's CSS to maintain consistency with Elementor's styling.

By following these steps, you can make your WordPress theme compatible with Elementor and provide users with the flexibility to customize their websites using the Elementor page builder.