Custom Password Protected page with Elementor Template

elementor_password_form_page.php

function elementor_password_form_page() {
    // Elementor Template ID
    $template_id = 3785; // Replace with your Elementor template ID

    // Check if Elementor is active and the template exists
    if (defined('ELEMENTOR_VERSION') && \Elementor\Plugin::$instance->templates_manager->get_source('local')->get_item($template_id)) {
        // Render the Elementor template
        return \Elementor\Plugin::$instance->frontend->get_builder_content_for_display($template_id, true);
    }

    // Fallback to the default password form if Elementor or the template is not available
    return '<form action="' . esc_url(site_url('wp-login.php?action=postpass', 'login_post')) . '" method="post">
        <label for="pwbox-' . (int) get_the_ID() . '">' . __('Password:') . ' </label>
        <input name="post_password" id="pwbox-' . (int) get_the_ID() . '" type="password" size="20" />
        <input type="submit" name="Submit" value="' . esc_attr__('Submit') . '" />
    </form>';
}
add_filter('the_password_form', 'elementor_password_form_page');

// register a shortcode to display the form [custom_password_form label="Password"]
function custom_password_form_shortcode($atts) {
    global $post;
    
    // Define default attributes and merge with user-defined attributes
    $atts = shortcode_atts(
        array(
            'label' => __('Password:') // Default label
        ), 
        $atts, 
        'custom_password_form'
    );
    
    // Extract the label attribute
    $label = $atts['label'];

    // Default WordPress password form markup
    $output = '<form action="' . esc_url(site_url('wp-login.php?action=postpass', 'login_post')) . '" method="post">
        <label for="pwbox-' . (int) $post->ID . '">' . esc_html($label) . ' </label><input name="post_password" id="pwbox-' . (int) $post->ID . '" type="password" size="20" /><input type="submit" name="Submit" value="' . esc_attr__('Submit') . '" />
    </form>';
    
    return $output;
}
add_shortcode('custom_password_form', 'custom_password_form_shortcode');

This overrides the password form to use an Elementor template and registers a shortcode to output the password form in the Elementor template for easy styling and customization.

The shortcode has one parameter for the label, so you can change the label text (or remove it by setting an empty string label="").