Elementor Shortcodes: A Comprehensive Guide

Elementor is a popular page builder plugin for WordPress that allows you to create and customize web pages using a drag-and-drop interface. Elementor provides a wide range of built-in widgets and elements, and you can also create your own custom elements using shortcodes.

Common Elementor Shortcodes

Here are some common Elementor shortcodes that you can use within the Elementor page builder:

1. Basic Shortcode

The basic Elementor shortcode is used to include a section or template created with Elementor on your page.

elementor-template id="YOUR_TEMPLATE_ID"

Replace YOUR_TEMPLATE_ID with the ID of the Elementor template you want to display.

2. Dynamic Data Shortcodes

Elementor allows you to dynamically display data from various sources using shortcodes. For example:

• Current Date:

  [elementor-template-date format="Y-m-d"]

• Current Post Title:

  [elementor-template-post-title]

• Current Post URL:

  [elementor-template-post-url]

3. User-Related Shortcodes

You can also display information related to the current user:

• Current User ID:

  [elementor-template-user-id]

• Current User Display Name:

  [elementor-template-user-display-name]

• Current User Email:

  [elementor-template-user-email]

4. Custom Shortcodes

You can create your own custom shortcodes to extend Elementor’s functionality. To do this, you’ll need to use Elementor’s API and PHP coding. Here’s a basic example:

// Define the shortcode callback function
function custom_shortcode_function( $atts ) {
    // Your custom logic here
    return 'Your Custom Content';
}

// Register the shortcode with Elementor
function register_custom_shortcode() {
    add_shortcode( 'custom_shortcode', 'custom_shortcode_function' );
}

add_action( 'elementor/widgets/widgets_registered', 'register_custom_shortcode' );

Now, you can use the [custom_shortcode] shortcode within the Elementor page builder, and it will display the content returned by the custom_shortcode_function().

Please note that when using shortcodes in Elementor, you typically add them to a Text Editor widget or a Shortcode widget. Elementor also provides dynamic tags that you can use directly within the widgets, which are a more user-friendly way to display dynamic content without having to remember and use shortcodes explicitly.