How to Use Elementor Forms in Your Custom Template

Elementor is a powerful page builder that simplifies WordPress design, but sometimes you may want to use an Elementor Form inside a custom template. Whether you're building a custom theme or creating a special layout, integrating an Elementor Form is straightforward. In this post, I'll walk you through three simple methods to achieve this.

Method 1: Using Elementor Shortcode

The easiest way to insert an Elementor form into a custom template is by using the Elementor template shortcode.

Steps:

  1. Create Your Form – Design your form using the Elementor Form widget and save it as a template.
  2. Get the Template Shortcode – Navigate to Templates > Saved Templates in WordPress and copy the shortcode of the saved template.
  3. Embed the Shortcode in Your Custom Template – Paste the shortcode into your custom template file using the following PHP function
1
echo do_shortcode('[elementor-template id="YOUR_TEMPLATE_ID"]');

Replace

YOUR_TEMPLATE_ID
with the actual ID of your saved template.

Method 2: Using Elementor's PHP Function

For better control over the output, you can use Elementor's built-in function to render a template inside your PHP file.

Steps:

  1. Ensure your form is saved as a template in Elementor.
  2. Insert the following PHP code in your custom template file:
1
echo \Elementor\Plugin::instance()->frontend->get_builder_content(YOUR_TEMPLATE_ID);

his function retrieves and displays the content of the specified Elementor template.

Method 3: Using Elementor’s API for Dynamic Embedding

If you need more flexibility, you can use Elementor’s API to dynamically fetch and display the form template.

Steps:

  1. Ensure Elementor is active on your site.
  2. Add this code to your custom template file:
1
2
3
4
use Elementor\Plugin;
 
$elementor = Plugin::instance();
echo $elementor->frontend->get_builder_content_for_display(YOUR_TEMPLATE_ID);

This method allows for more dynamic form rendering.

Final Thoughts

Using Elementor Forms in a custom template can enhance your website’s functionality without relying on additional plugins. Whether you prefer using a shortcode, PHP functions, or Elementor's API, these methods provide a seamless way to integrate forms into your custom layouts.

Do you use Elementor Forms in your custom templates? Let me know in the comments!

No comments:

Post a Comment