Recently, I faced an issue while using the SFC plugin with Elementor Pro: Elementor Pro could not read my “Custom Fields.” After some trial and error, I found a solution that allowed me to continue my work without interruptions. Below, I share the step-by-step process and the PHP scripts I used to solve the problem. I hope this helps others facing the same issue.

Step 1: Debugging the Custom Fields

To begin, I needed to ensure that my “Custom Fields” were being loaded correctly in WordPress. I wrote the following PHP function to display all the post data and custom fields on a page:

Code: Print Post Data:

// Debugging Post Data and Custom Fields
function print_post_data() {
    // Get the current post ID
    $post_id = get_the_ID();

    // Get the full post object
    $post = get_post($post_id);

    // Print the full post object
    echo '<pre>';
    print_r($post);
    echo '</pre>';

    // Print all custom fields (post meta)
    $custom_fields = get_post_meta($post_id);
    echo '<pre>';
    print_r($custom_fields);
    echo '</pre>';
}

// Shortcode to debug post data
add_shortcode('print_post_info', 'print_post_data');

How it works:

• Use the shortcode [print_post_info] on any post or page.
• This function displays all the post data and custom fields to verify if they exist.

Step 3: Displaying a Specific Custom Field Using a Shortcode

To make the custom fields accessible in Elementor, I created a function that uses a shortcode to display the value of a specific custom field.

Code: Display Specific Custom Field

function check_and_echo_custom_field($atts) {
    // Default attribute: custom field name
    $atts = shortcode_atts(
        array(
            'field' => 'change_screen_premium_time', // Default field
        ),
        $atts,
        'check_custom_field'
    );

    // Get the current post ID
    $post_id = get_the_ID();

    // Retrieve the value of the custom field
    $custom_field_value = get_post_meta($post_id, $atts['field'], true);

    // Return the value if it exists
    if (!empty($custom_field_value)) {
        return esc_html($custom_field_value);
    }

    return ''; // Return nothing if the field is empty
}
add_shortcode('check_custom_field', 'check_and_echo_custom_field');

How it works:

• Use the shortcode [check_custom_field field="your_field_name"] to display the value of a specific custom field.
• Replace "your_field_name" with the name of the custom field you want to display.

By using these scripts, I successfully displayed the custom fields in Elementor Pro. While this solution may not be the only way to solve the issue, it worked perfectly for my needs, and I hope it helps others facing similar challenges. 😀

Plugins:

• Elementor
• SFC