Full-Ajax Theme: parseJSON error while building a JSON object from a WordPress custom template

Replacing all the specific the_content() functions, or the_ID… etc by the getters equivalent seems to fix the problem. Here the solution:

<?php

$o = array();

$o[ 'title' ] = wp_title( '|', false, 'right' );
$o[ 'type' ] = 'single-project';

//ob_start();
$article="<div id="container" class="content-area project-content">";
    $article .= '<main id="main" class="site-main" role="main">';

        while (have_posts()) : the_post();

        $article .= '<article id="post-'.get_the_ID().'"'.get_post_class().'>';

            $article .= $image0 = wp_get_attachment_image_src(get_field('project_hero'), 'full');
            $article .= '<img class="project-hero" src="'.$image0[0].'" alt="'.get_the_title(get_field('project_hero')).'" />';

            $article .= '<section class="project-head entry-header">';
                $article .= '<div class="clearfix">';
                    $article .= '<h3 class="project-title entry-title">';
                        $article .= get_the_title();
                    $article .= '</h3>';
                    $article .= '<ul class="project-infos clearfix entry-meta">';

                        if ( has_term('frontend', 'projectcat')) {
                            $article .= '<li><i class="fa fa-desktop"></i><span>Frontend</span></li>';
                        }
                        else if ( has_term('design', 'projectcat')) {
                            $article .= '<li><i class="fa fa-pencil"></i><span>Design</span></li>';
                        }
                        else if ( has_term('application', 'projectcat')) {
                            $article .= '<li><i class="fa fa-code"></i><span>Application</span></li>';
                        }
                        else {
                            $article .= '<li><span><i class="fa fa-question"></i>Category not specified</span></li>';
                        }

                        $article .= '<li><i class="fa fa-calendar"></i><span>'.get_field('project_year').'</span></li>';
                        $article .= '<li><i class="fa fa-users"></i><span>'.get_field('project_client').'</span></li>';
                    $article .= '</ul>';
                $article .= '</div>';
                $article .= '<div class="project-intro entry-content">'.get_the_content().'</div>';
            $article .= '</section>';
            $article .= '<section class="project-body entry-content">';
                $article .= '<h4 class="project-subtitle">'.get_field('project_image_section_1_title').'</h4>';
                $image1 = wp_get_attachment_image_src(get_field('project_image_section_1_images'), 'full');
                $article .= '<img src="'.$image1[0].'" alt="'.get_the_title(get_field('project_image_section_1_images')).'" />';
                $article .= '<h4 class="project-subtitle">'.get_field('project_image_section_2_title').'</h4>';
                $image2 = wp_get_attachment_image_src(get_field('project_image_section_2_images'), 'full');
                $article .= '<img src="'.$image2[0].'" alt="'.get_the_title(get_field('project_image_section_2_images')).'" />';
                $article .= '<h4 class="project-subtitle">'.get_field('project_image_section_3_title').'</h4>';
                $image3 = wp_get_attachment_image_src(get_field('project_image_section_3_images'), 'full');
                $article .= '<img src="'.$image3[0].'" alt="'.get_the_title(get_field('project_image_section_3_images')).'" />';
            $article .= '</section>';
        $article .= '</article><!-- #post-## -->';

    endwhile;


$article .='</main><!-- #main -->';
$article .='</div><!-- #primary -->';

$o['article']= $article;
//$o = ob_get_clean();

echo json_encode($o);
exit();

Leave a Comment