WordPress REST API – how to parse JSON and use a loop to retrieve data inside a template page

This question must have been asked a lot of time and answered as well. Unfortunately I am not being able to find the exact thing I need.

I have a custom Post Type and a custom end-point developed in my application. API end point is giving data already.

I have created a template page and written the following code there:

<?php
/*
* Template name: Recent stories
*/

$request = wp_remote_get( 'http://local.tourplanner.com/wp-json/wp/v2/api/travelog?per_page=5' );

if( is_wp_error( $request ) ) {
    return false; // Bail early
}

$body = wp_remote_retrieve_body( $request );

$data = json_decode( $body, true );
var_dump($data);

?>

Things are pretty good so far. So now I need to parse the JSON returned by API. When I am pulling data using the endpoint it comes in like this:

[{“id”:1,”date”:”2016-12-22T10:52:56″,”date_gmt”:”2016-12-22T10:52:56″,”guid”:{“rendered”:”/?p=1″},”modified”:”2016-12-22T10:52:56″,”modified_gmt”:”2016-12-22T10:52:56″,”slug”:”hello-world”,”status”:”publish”,”type”:”post”,”link”:”/hello-world/”,”title”:{“rendered”:”Hello
world!”},”content”:{“rendered”:”

Welcome to WordPress. This is your
first post. Edit or delete it, then start
writing!

n”,”protected”:false},”excerpt”:{“rendered”:”

Welcome
to WordPress. This is your first post. Edit or delete it, then start
writing!

n”,”protected”:false},”author”:1,”featured_media”:0,”comment_status”:”open”,”ping_status”:”open”,”sticky”:false,”template”:””,”format”:”standard”,”meta”:[],”categories”:[1],”tags”:[],”_links”:{“self”:[{“href”:”/wp-json/wp/v2/posts/1″}],”collection”:[{“href”:”/wp-json/wp/v2/posts”}],”about”:[{“href”:”/wp-json/wp/v2/types/post”}],”author”:[{“embeddable”:true,”href”:”/wp-json/wp/v2/users/1″}],”replies”:[{“embeddable”:true,”href”:”/wp-json/wp/v2/comments?post=1″}],”version-history”:[{“href”:”/wp-json/wp/v2/posts/1/revisions”}],”wp:attachment”:[{“href”:”/wp-json/wp/v2/media?parent=1″}],”wp:term”:[{“taxonomy”:”category”,”embeddable”:true,”href”:”/wp-json/wp/v2/categories?post=1″},{“taxonomy”:”post_tag”,”embeddable”:true,”href”:”/wp-json/wp/v2/tags?post=1″}],”curies”:[{“name”:”wp”,”href”:”https://api.w.org/{rel}”,”templated”:true}]}}]

But when I var_dump($data) inside the template page the data looks like this:

array(2) { [0]=> array(16) { [“id”]=> int(720) [“date”]=> string(19)
“2017-03-29T07:08:44” [“date_gmt”]=> string(19) “2017-03-29T07:08:44”
[“guid”]=> array(1) { [“rendered”]=> string(31)
“/?post_type=travelog&p=720” } [“modified”]=> string(19)
“2017-04-25T14:00:14” [“modified_gmt”]=> string(19)
“2017-04-25T14:00:14” [“slug”]=> string(49)
“my-travel-diary-amritsar-to-dalhousie-and-khajjar” [“status”]=>
string(7) “publish” [“type”]=> string(8) “travelog” [“link”]=>
string(60)
“/travelog/my-travel-diary-amritsar-to-dalhousie-and-khajjar/”
[“title”]=> array(1) { [“rendered”]=> string(53) “My Travel Diary –
Amritsar to Dalhousie and Khajjar” } [“content”]=> array(2) {
[“rendered”]=> string(2566) ” It was raining when I reached the
“Amritsar ISBT” at around 9:30am. I thought I had missed the 9:10
direct bus to Dalhousie but to my relief, the bus was waiting at the
gate.

It was a long journey of eight hours as the bus stopped at many places
on the way. After the sweltering heat in Delhi and Amritsar, it felt
good to experience pleasant weather when the bus entered the state of
Himachal Pradesh. The beautiful hilly landscape was a treat for the

eyes....

Now in order to extract values from the JSON I modified the above code:

<?php
/*
* Template name: Recent stories
*/

$request = wp_remote_get( 'http://local.tourplanner.com/wp-json/wp/v2/api/travelog?per_page=5' );

if( is_wp_error( $request ) ) {
    return false; // Bail early
}

$body = wp_remote_retrieve_body( $request );

//Added the following lines

$data = json_decode( $body, true );
//var_dump($data);

foreach ($data as $key => $value) {
    echo $value["id"] . ", " . $value["title"][0] . "<br>";
}

?>

The output of the above code comes like this:

720, Array
488, Array

I am not being able to dig inside “Array” to extract the title part. I also need to extract URL of each post as well.

I am new in WordPress. Please tell me what I am doing wrong.

Read more here: WordPress REST API – how to parse JSON and use a loop to retrieve data inside a template page

Leave a Reply

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