Using API to fetch data from one site to display on another - json

Question

I have a site on Wordpress where I am trying to find the best way to create a dropdown which displays data from a custom taxonomy to eventually integrate it into a different site (also on Wordpress).
Where I have go to is trying to obtain the correct Routes/URL's to fetch this information.
I have a Post type called listings which has a taxonomy called listing_area which has different areas where posts are associated, e.g. Wales, East Anglia.
I have got so far that I have decided to use the Plugin WP-API (whether this is the right thing I don't know, I am aware that Wordpress now had an API in it's new update). I have managed to get this URL working and pulling in the terms of listing_area - http://scd.blaze.wpengine.com/wp-json/taxonomies/listing_area/terms/174
This is the test page I have going which is linking to these URL's in turn -
http://scd.blaze.wpengine.com/test/
I have no idea if I'm doing the right thing here and I have very basic knowledge on it and would hugely appreciate it if someone could point me in the right direction!
Thanks

Answer 1

You're going on the right path, but I suggest to work straight with the fresh Wordpress REST API if you can upgrade your websites to 4.4. Otherwise you can still use your REST plugin as it is pretty much the same. I'll try to explain how to go through what you want to achieve (navigate through terms of a distant Wordpress website and display posts related to this terms).
Get the terms from the other WP
Using the new WP REST API, here is a small function that you can use to get your taxonomy terms:
public function getDistantTerms($taxonomy) {
$response = wp_remote_get('http://www.yourwebsite.com/wp-json/wp/v2/terms/' . $taxonomy);
if(is_wp_error($response)) {
return array();
}
return json_decode(wp_remote_retrieve_body($response));
}
Here I make use of wp_remote_get function to get the JSON return from the REST function terms by passing it as parameter the taxonomy slug (ex:listing_area) - here is a demo of what it returns. Add this function to your functions.php then use it in your template to build up your select:
<select name="term_select">
<option value="">Please choose a term</option>
<?php foreach(getDistantTerms('listing_area') as $term): ?>
<option value="<?php echo $term->slug; ?>"><?php echo $term->name; ?></option>
<?php endforeach; ?>
</select>
It seems that's pretty much what you actually got.
Link your select to a custom template
So the next step is to redirect to a page that list the posts of the term you choose. First we handle the redirection in JS:
$('select[name="term_select"]').change(function() {
if($(this).val() != "") {
window.location = "/show-post-term/" + $(this).val();
}
});
We add a little rewrite rule to redirect this url (change it to whatever you want) to a template we'll name distant-posts.php (all of this take place in your theme functions.php):
1. Add the rewrite rule
add_action('init', 'distantposts_rewrite_rules');
function distantposts_rewrite_rules() {
add_rewrite_rule('show-post-term/([^/]+)/?$', 'index.php?term_slug=$matches[1]&distant_post=true', 'top');
}
2. Add two query vars
add_filter('query_vars', 'distantposts_query_vars' );
function distantposts_query_vars($vars) {
$vars[] = 'term_slug';
$vars[] = 'distant_post';
return $vars;
}
3. Redirect to the template if query vars are set
add_filter('template_include', 'yourpluginname_blah_template_include', 1, 1);
function yourpluginname_blah_template_include($template) {
global $wp_query;
$distant_post = $wp_query->query_vars['distant_post'];
$term_slug = $wp_query->query_vars['term_slug'];
if($distant_post && $term_slug) {
$tpl = locate_template(array('distant-posts.php'));
if(!empty($tpl)) {
return $tpl;
}
}
return $template;
}
So in short what we're doing here: we add a rule that handle the /show-post-term/term-slug URL by redirecting it to index with two query vars: one that tell we're in a "distant posts" mode and one that carry the term slug. Then we declare those query vars to Wordpress, and use them to change the template that Worpdress should display if they're set.
List the distants posts from the taxonomy term
Back to the REST API. We use the GET REST function posts by passing it as GET parameters the taxonomy name as key, and the term slug as value. Here is a demo of what kind of return you get.
An important note before going further: after you updated to WP 4.4, you need to change your taxonomy declaration in order to make this work. You need to add to your declaration the parameter show_in_rest set to true, and set query_var to true.
So we add this little function to functions.php to retrieve the posts from the template:
public function getDistantPosts($taxonomy, $term) {
$response = wp_remote_get('http://www.yourwebsite.com/wp-json/wp/v2/posts?' . $taxonomy . '=' . $term);
if(is_wp_error($response)) {
return array();
}
return json_decode(wp_remote_retrieve_body($response));
}
And then in your template, you call it this way:
global $wp_query;
$posts = getDistantPosts('listing_area', $wp_query->query_vars['term_slug']);
Then use the $posts array to display your posts (it contain regular post objects).
Going further
A few things that you may want to do now that you have the context established:
Add cache to the REST return
In order to avoid to overload your main website server, you should really consider caching your REST calls results. I will not detail this here as there is some work to do on it, but a good start could be this script.
Add pagination to your distant posts template
If you have a lot of posts associated to your terms, you might want to add a pagination. You can change a bit the distant posts REST function to add the page parameter for this - see the documentation.
Add a "single page" for your distant posts
You might want to have individual pages for your distant posts on your main website, as the text might be too long for the list mode. You can start on the distant-posts.php code and add a post_id query var, then use the REST posts function to get your post like this : /wp-json/wp/v2/posts/<post_id>
To understand the basics of the WP REST API I strongly suggest you to visit the wp-api.org website. There is a pretty good article on the REST API on wpmudev.org that you can read too. If you need to learn about the REST basics, I suggest you to read the Wikipedia post about it.
Hope you'll manage to get through this, have fun!

Answer 2

I found this this url got me the results I needed -
http://scd.blaze.wpengine.com/wp-json/posts?type=listings&filter[listing_area]=channel
my post type being listings and the slug of my term channel