Template Hooks: Custom WordPress API Content

WordPress post pages in your app display pre-defined content from the WP-API. What if you want to add more, such as a product price, event date, or video link? That's possible with template hooks.

List page

• Thumbnail (optional)
• Title
• Excerpt
• Slide Content

Post detail page

• Title
• Content

Usage

This code goes in a plugin on your WordPress site. First make sure the WP-API (v2) is enabled. In this example we are adding post meta to the wp-json/wp/v2/posts endpoint.

/**
* Use an AppPresser template hook
*/
add_action( 'rest_api_init', 'my_register_template_hook' );
function my_register_template_hook() {
    register_rest_field( 'post', // any post type registered with API
        'appp',
        array(
            'get_callback'    => 'my_get_hook_data',
            'update_callback' => null,
            'schema'          => null,
        )
    );
}


/**
 * Get the value of a meta field field
 *
 * @param array $object Details of current post.
 * @param string $field_name Name of field.
 * @param WP_REST_Request $request Current request
 *
 * @return mixed
 */
function my_get_hook_data( $object, $field_name, $request ) {
	
	$data = [];
	// $data['post_list']['above_title'] = '<span class="schedule-time">' . get_post_meta( $object['id'], 'schedule_time', 1 ) . '</span>';
	
	$data['post_detail']['above_title'] = '<div class="post-featured-wrap">' . get_the_post_thumbnail( $object['id'], 'large', array( 'class' => 'post-featured' ) ) . '</div>';	
	return $data;
}

You can edit the code above to add this content for a specific post type, and change the content that is displayed in the app. We are showing post meta called schedule_time above the title in a post list, which is great for a conference schedule or event app. We are also displaying the post thumbnail on the post detail page.

Video: Events Calendar

First part of the video is here.

The full demo code from the video is available here.

Note: in the first part of the video I used register_post_meta to add the event cost, you don't actually need to do that. You can skip to the part where I add the template hook using the code above.

Available Hooks

appp.post_list.slide_content - Add custom content inside a slide, below the title

appp.post_list.above_title - Display content above the title on the post list page

appp.post_list.below_title - Display content below the title on the post list page

appp.post_list.below_content - Display content beneath the excerpt on the post list page

appp.post_detail.above_title - Display content above the title on the post detail page

appp.post_detail.below_title - Display content below the title on the post detail page

appp.post_detail.below_content - Display content beneath the excerpt on the post detail page