How to Call Elementor Template in Custom WordPress Template

To call Elementor Template in your Custom Template Use Below Code

Insert the Template via PHP Code

<?php
/* Template Name: My Custom Page */
echo \Elementor\Plugin::instance()->frontend->get_builder_content_for_display(1234); // Replace 1234 with your template ID
?>

Check if Elementor is active

<?php
/* Template Name: My Custom Page */
if ( did_action( 'elementor/loaded' ) ) {
    echo \Elementor\Plugin::instance()->frontend->get_builder_content_for_display(1234);
}
?>

Ahh got it — if your Elementor template contains shortcodes (like [my_shortcode]) and you’re rendering it using:

<?php
/* Template Name: My Custom Page */
if ( did_action( 'elementor/loaded' ) ) {
    $content = \Elementor\Plugin::instance()->frontend->get_builder_content_for_display(1234);
    echo do_shortcode($content);
}
?>

Load Theme Header & Footer

Above Code only Add Template, but it looks odd sometimes because you are not adding Header and Footer in your Template file so you Have to call Header and Footer Like Below

<?php
/* Template Name: My Custom Page */
get_header(); ?>
<div class="custom-wrapper">
  <?php
  if ( did_action( 'elementor/loaded' ) ) {
      echo \Elementor\Plugin::instance()->frontend->get_builder_content_for_display(1234);
  }
  ?>
</div>
<?php get_footer(); ?>

❌ Avoid this:

Using get_header() and get_footer() will likely wrap your Elementor content in a theme container (like <div class="container">), breaking full-width designs.

Load Elementor Header & Footer (Pro Feature / Theme Builder)

If you’re using Elementor Pro with the Theme Builder, and you’ve created a custom header and footer with it, then you can dynamically render those too.

This lets you fully replace your theme’s layout with Elementor’s Theme Builder parts — no need for get_header() and get_footer().

Replace get_header() and get_footer() with:

<?php
use ElementorPro\Modules\ThemeBuilder\Module;

if ( did_action( 'elementor/loaded' ) && class_exists('ElementorPro\Modules\ThemeBuilder\Module') ) {
    $header = Module::instance()->get_location('header');
    $footer = Module::instance()->get_location('footer');
    if ( $header ) {
        echo ElementorPro\Modules\ThemeBuilder\Module::instance()->get_rendered_location( 'header' );
    }
}

echo \Elementor\Plugin::instance()->frontend->get_builder_content_for_display(1234);

if ( did_action( 'elementor/loaded' ) && class_exists('ElementorPro\Modules\ThemeBuilder\Module') ) {
    if ( $footer ) {
        echo ElementorPro\Modules\ThemeBuilder\Module::instance()->get_rendered_location( 'footer' );
    }
}
?>

⚠️ This requires Elementor Pro and the use of Theme Builder templates for the header and footer.

🧙‍♂️ Pro Trick: Load Elementor Template via Shortcode Anywhere

You can create a global shortcode for Elementor templates:

Insert the Code in functons.php

Add code to your child theme’s functions.php file or via a plugin that allows custom functions to be added, such as the Code snippets plugin. Avoid adding custom code directly to your parent theme’s functions.php file as this will be wiped entirely when you update the theme.

function render_elementor_template_shortcode($atts) {
    $atts = shortcode_atts([
        'id' => '',
    ], $atts);

    if ( empty( $atts['id'] ) ) return '';

    return \Elementor\Plugin::instance()->frontend->get_builder_content_for_display( $atts['id'] );
}
add_shortcode('elementor_template', 'render_elementor_template_shortcode');

Now you can use [elementor_template id="123"] anywhere (even in widgets or blocks)!