Question 195509 in Elementor Question posted in
A comprehensive tutorial library can be found here.

Cannot edit with Elementor when custom plugin is activated, content area is not found

I made a custom plugin that creates a table with data from a custom post type. I am using "The Gem" theme, this problem is specific to this page only (which is not using a different template). When I activate this plugin, I cannot "Edit with Elementor" and get the following message when I try:
Sorry, the content area was not found in your page. You must call ‘the_content’ function in the current template, in order for Elementor to work on this page.

When the plugin is activated, it does not break the page, I just cannot edit the page with Elementor. I can deactivate it and get back in to Elementor. I’ve tried adding the_content(); into my plug-in but this doesn’t work. I think it’s something in the plugin code because if I just echo "Hello World!" there is no problem and I can get back into the Elementor editor. Edited to include full plugin code below:

function queryGrantPosts() {
    // the args
    $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
    $args = array(
        'post_type' => 'grants',
        'posts_per_page' => '10',
        'paged' => $paged,
        'orderby' => 'title',
        'order' => 'ASC',
    );
    $args['search_filter_id'] = 1350;

    $myPosts = new WP_Query($args) ;
    return $myPosts ;
}

function createTableEndHTML(){
    $myHTML = '';
    $myHTML .= '    </table>';
    $myHTML .= '</div>';
    $myHTML .= '<div class="pagination">';
    $myHTML .= '    <?php the_custom_pagination( $the_query); ?>';
    $myHTML .= '</div>';
    return $myHTML;
                
}
function createTableStartHTML(){
    $myHTML = '';

    $myHTML .= '<div class="table-wrap">';
    $myHTML .= '    <table class="grants-list">';
    $myHTML .= '            <thead class="grants-listing">';
    $myHTML .= '                    <th width="33%">Organization,<br>Program Name</th>';
    $myHTML .= '                    <th width="10%">City,<br>Location</th>';
    $myHTML .= '                    <th width="8%">Amount</th>';
    $myHTML .= '                    <th width="5%">Life Cycle (months)</th>';
    $myHTML .= '                    <th width="25%">Counties Served</th>';
    $myHTML .= '            </thead>';
    return $myHTML;
}

function createTableContentHTML($pPosts){
    $myHTML = '';

    // the loop 
    while ( $pPosts->have_posts() ) : $pPosts->the_post(); 
        $number = get_field('amount_num'); 
        $amount = number_format($number);
        $programName = get_field('program_name');
        $organizationCity = get_field('organization_city');
        $geographicLocation = get_field('geographic_location');
        $grantLifeCycle = get_field('grant_life_cycle');
        $myTerms = get_the_terms(get_the_ID(), 'counties_served');
        if ( $myTerms && ! is_wp_error($myTerms) ) {
            $myTermList = join(', ', wp_list_pluck($myTerms, 'name'));
        }
                    
        $myHTML .= '<tr class="grants-listing">';
        $myHTML .= '    <td class="program-name">';
        $myHTML .= '        <span style="font-family: Gotham Bold, sans-serif;">' . get_the_title() . '</span></br>' ;
        $myHTML .= $programName . '</td>';
        $myHTML .= '    <td>' . $organizationCity . '<br><em>' . $geographicLocation . '</em></td>';
        $myHTML .= '    <td>' . $amount . '</td>';
        $myHTML .= '    <td>' . $grantLifeCycle . '</td>';
        $myHTML .= '    <td>';
        $myHTML .= $myTermList;

        $myHTML .= '    </td>';
        $myHTML .= '</tr>';         
    endwhile; 
    
    return $myHTML;

}

function createTablePagination($pPosts){
    $myHTML = '';
    $myHTML .= '<div class="gem-pagination">';
    $myHTML .= the_custom_pagination( $pPosts ); 
    $myHTML .= '</div>';
    return $myHTML;
}
the_content(); 
add_shortcode('bpr_grant_table', 'createGranteeTable');
function createGranteeTable(){
    $myPosts = queryGrantPosts();
    echo createTableStartHTML();
    echo createTableContentHTML($myPosts);
    echo createTableEndHTML();
    if (function_exists( 'the_custom_pagination' ) ) {
        createTablePagination($myPosts);
    } else {
        echo 'function not found';
    }
}

Any ideas? Am I calling this function incorrectly or in the wrong place?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Update! Found this code which solved the problem for me. If I place this code before the query

    $wp_query = null;
$wp_query = new WP_Query($args);

    And this code after the loop

    $wp_query = null;
wp_reset_query();

    then I no longer get the Elementor error.


  2. 0

    There are different kinds of solutions to solve the issue.

    Have you or the theme’s developer created a custom WordPress page template for your theme that does not include the_content function? You will need to include the_content in your code to edit it with Elementor or switch to a different theme, which often solves the problem. First, try switching to a theme like Hello and see if your problem is solved. If you are a web developer and are developing a theme, add the_content function into the page template’s code. This is the line you need to add: <?php the_content(); ?> If you are not familiar with where to place this code or how to add it to the page, please contact your website developer so it can be implemented properly as we cannot provide full support for that. Please note that adding this code won’t enable the editing of Archive pages and Latest Post pages (these pages have to be edited via the theme builder of Elementor) and it is really simple.

    for more information please read the articles:

    https://elementor.com/help/the-content-area-was-not-found-error/

    https://kinsta.com/knowledgebase/you-must-call-the-content-function-elementor/

    Thank you

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search