How to make a specific section load after the rest of the sections in wordpress

I am currently working on a website and it is a WordPress, i have a section in which i added a fonction call.

this fonction call data from an API and i’ve put it in “fonction.php”

As it takes take to load, i would like to make this section load the last on the page or show a loading icon so user will not need to wait for the page to load everything

here is the code that i’ve used :

$access_token = “——————————————–“;

// This is the function to get all opportunities from YOP to SDG #1 to be viewed on Y4GG website
function Y4GG_SDG1( $atts ) {
$date = date(‘Y-m-d’);
///////////////////////////////////////////////////////////////////////////////////////
error_reporting(E_ALL); // Make sure this is changed to 0 on prod server
global $access_token, $stats, $start, $end, $office_id;

    $url = "https://gis-api.aiesec.org/v2/opportunities.json?access_token=$access_token&filters[sdg_goals][]=1101&filters[programmes][]=1&per_page=50&filters[last_interaction][from]=2017-01-30&sort=earliest_start_date&earliest_start_date=$date";
    $response = json_decode(file_get_contents($url));
    //echo $url;
    if(!function_exists("curl_init")) die("cURL extension is not installed");
$curl_options = array(
                    CURLOPT_URL => $url,
                    CURLOPT_HEADER => 0,
                    CURLOPT_RETURNTRANSFER => TRUE,
                    CURLOPT_TIMEOUT => 0,
                    CURLOPT_SSL_VERIFYPEER => 0,
                    CURLOPT_FOLLOWLOCATION => TRUE,
                    CURLOPT_ENCODING => 'gzip,deflate',
            );
            $ch = curl_init();  
            curl_setopt_array( $ch, $curl_options );
            $output = curl_exec( $ch );
            curl_close($ch);

//$response = json_decode($output,true);
    $respo = $response->data;
    //if( is_array($response)) echo"true"; else echo "false";
    //echo $respo;
$strarr='';
$count=0;
$MC_is_exists = false;
    foreach ($respo as $value)
    { 
        if(count($MC_ids)== 6){ break;}
        for($i =0; $i < count($MC_ids);$i++){

            if($MC_ids[$i] == $value->office->parent_id) {
                $MC_is_exists = true; break;
                }

        }
        if(!$MC_is_exists){

            $MC_ids[$count]= $value->office->parent_id;
            $strarr .= '<div class="vc_col-sm-4 wpb_column column_container vc_column_container col no-extra-padding mpc-column instance-41" data-shadow="none" data-border-animation="" data-border-animation-delay="" data-border-width="none" data-border-style="solid" data-border-color="" data-bg-cover="" data-padding-pos="all" data-has-bg-color="false" data-bg-color="" data-bg-opacity="1" data-hover-bg="" data-hover-bg-opacity="1" data-animation="" data-delay="0" data-column-id="mpc_column-1258f94c6103059" style="height: 339px;">
        <div class="vc_column-inner">
            <div class="wpb_wrapper">
                <div class="nectar-fancy-box" data-color="accent-color"><div class="box-bg" style="background-image: url('. $value->cover_photo_urls.'); "></div> <div class="inner" style="min-height: 200px"><h2 style="font-size: 28px;letter-spacing: -1px;line-height: 30px;">'. $value->title.'</h2><h4>'. $value->office->country.'</h4></div> <div class="link-text">Be one of the million<span class="arrow"></span></div> <a target="_blank" href="https://opportunities.aiesec.org/opportunity/'. $value->id.'" class="box-link"></a> </div>
            </div> 
        </div>
    </div>';
    $count++;

        }

        $MC_is_exists = false;



}
return $strarr;
}
add_shortcode( 'Y4GG_SDG1', 'Y4GG_SDG1');

Read more here: How to make a specific section load after the rest of the sections in wordpress

Leave a Reply

Your email address will not be published. Required fields are marked *