Displaying API results inside a WordPress page template

Question

I've created a WordPress page template that calls an API using Httpful and formats the results. This is my first time using APIs on a page, so I'd like to know if this is the right direction to go in.

The code below uses information from a members API to receive the member's information and display their basic information along with a single upcoming class.

page-members.php

<?php
/**
 * The template for displaying a list of members.
 *
 * @package themename
 */
get_header();
// call from api using basic auth
require_once 'inc/httpful.phar';
$uri = "https://api.example.com/v1/accounts/KEY/members_list";
$response = \Httpful\Request::get($uri)
 ->addHeader('Authorization', 'Basic KEY')
 ->expects('application/json')
 ->send();
?>
<main class="members">
 <section class="members-content">
 <?php
 $defaultImage = get_field('logo', 'option');
 // loop through api response for each member
 foreach($response->body->members as $member) :
 $memberID = $member->id;
 // if member has no id, skip member
 if (empty($memberID)) :
 continue;
 endif;
 // if member has no image, use default logo
 $memberImage = (!empty($member->image)) ? $member->image : $defaultImage;
 $memberName = $member->name;
 $memberTagline = $member->tagline;
 // loop through upcoming classes for each member
 foreach($member->upcoming_classes as $class) :
 $classID = $class->id;
 // if class has no id, skip class
 if (empty($classID)) :
 continue;
 endif;
 $className = $class->name;
 $classDate = $class->date;
 $classTime = $class->start_time;
 ?>
 <div class="members-column">
 <a href="<?php echo site_url() . '/member/?MemberID=' . $memberID; ?>">
 <div class="members-image" style="background: url('<?php echo $memberImage; ?>') no-repeat top center / cover;">
 </div>
 </a>
 <div class="members-list">
 <h2 class="members-list-name"><?php echo $memberName; ?></h2>
 <h4 class="members-list-tagline"><?php echo $memberTagline; ?></h4>
 </div>
 <div class="members-class">
 <span class="members-class-info">
 <?php echo $className; ?><br>
 <!-- format class date, ex: 01/01 - 1:00pm --> 
 <?php echo date('m/d', strtotime($classDate)); ?> — <?php echo date('g:i a', strtotime($classTime)); ?>
 </span>
 <a class="button" href="<?php echo site_url() . '/reserve/?classID=' . $classID; ?>">Book</a>
 </div>
 </div>
 <?php
 // end class loop by breaking on first upcoming class with an id
 break; endforeach; endforeach;
 ?>
 </section>
</main>
<?php get_footer(); ?>

Is there anything I can do to improve this single template?

Answer 1

I see three things

I'm not too terribly familiar with custom wordpress tempaltes, but I'm fairly certain you shouldn avoid doing the API logic in the view. You should call the API in a controller and pass the result to the view, if at all possible. This is a standard separation of concerns.

Additionally, you shouldn't assume the API call will work. If they're server or dns has issues, or they make a breaking change to their API, you should handle it gracefully and inform the user that there are issues. Right now it appears foreach($response->body->members as $member) would fail if the API failed.

Finally, it's a good idea to keep the "Basic KEY" in a config or something, so you don't need to touch the code to update the key.

• Mike Brant: Agree with comment here, though Wordpress is awful with regards to separation of view from logic. This mixing of business logic with view is probably just an extension of that awfulness :) Probably API call should be made even before get_header() call, as that call renders output to browser.
• Goose: @MikeBrant spot on. That's why I included the caveat " if at all possible.", because I know you have to be pragmatic when using a platform.