CODEWITHSUNDEEP
phpwordpressfetch-apiwordpress-rest-apidivi
Ilia Popov
Ilia Popov

Reputation: 120

Using custom template for page doesn't allow me to use the Divi builder feature

I basically extended the Divi theme and this is one of the files that are there.

This file creates custom template, in order to fetch some data and display it, but rn the Divi builder is not available and I cannot use it.

I want to be able to use that functionality of Divi + add those fetched posts, is there a way?

/**
 * Template Name: Exams Template
 */

do_action('et_before_main_content');
get_header(); 
?>

<div id="primary" class="content-area">
    <main id="main" class="site-main">

        <header class="page-header">
            <h1 class="page-title"><?php echo esc_html( get_the_title() ); ?></h1>
        </header>

        <div class="styled-boxes">
            <?php
            // Fetch exams data from REST API endpoint
            $response = wp_remote_get( 'http://testyourself.net/wp-json/wp/v1/exams/' );
            if ( is_wp_error( $response ) ) {
                echo '<p>Error fetching exams data.</p>';
            } else {
                $exams_data = json_decode( wp_remote_retrieve_body( $response ), true );
                // Check if exams data is available
                if ( ! empty( $exams_data ) ) {
                    foreach ( $exams_data as $exam ) {
                        ?>
                        <div class="styled-box">
                            <h2><?php echo esc_html( $exam['title'] ); ?></h2>
                            <div class="exam-content"><?php echo wpautop( $exam['content'] ); ?></div>
                            
                        </div>
                        <?php
                    }
                } else {
                    echo '<p>No exams data available.</p>';
                }
            }
            ?>
        </div><!-- .styled-boxes -->

    </main><!-- #main -->
</div><!-- #primary -->

<?php 
get_footer(); 
do_action('et_after_main_content');
?>

Upvotes: 1

Views: 107

Answers (1)

Narendra Sishodiya
Narendra Sishodiya

Reputation: 603

We can't use Divi Builder on Custom Template. If you want to use Divi builder along with Exam data then I suggest you to create Shortcode which can be added in Divi builder so with the help of this you can use Divi Builder along with Exam data.

The given code will register shortcode to fetch and display exams data. Please add this code to functions.php file of your theme or custom plugin.

function fetch_exams_data_shortcode() {
    ob_start(); // Here we have started output buffering.

    // Here we are fetching exams data from REST API endpoint.
    $response = wp_remote_get( 'http://testyourself.net/wp-json/wp/v1/exams/' );
    if ( is_wp_error( $response ) ) {
        echo '<p>Error fetching exams data.</p>';
    } else {
        $exams_data = json_decode( wp_remote_retrieve_body( $response ), true );
        // Here we are checking if exams data is available.
        if ( ! empty( $exams_data ) ) {
            echo '<div class="styled-boxes">';
            foreach ( $exams_data as $exam ) {
                echo '<div class="styled-box">';
                echo '<h2>' . esc_html( $exam['title'] ) . '</h2>';
                echo '<div class="exam-content">' . wpautop( $exam['content'] ) . '</div>';
                echo '</div>';
            }
            echo '</div><!-- .styled-boxes -->';
        } else {
            echo '<p>No exams data available.</p>';
        }
    }

    return ob_get_clean(); // Here we have returned the buffered content.
}

add_shortcode( 'fetch_exams', 'fetch_exams_data_shortcode' );

Please let me know if this helps.

Upvotes: 0

Related Questions