Setting up ACF Pro with WP REST API

• milkula

• March 28, 2017 at 9:46 am

I am using the following plugins to get JSON data from WordPress REST API:

Advanced Custom Fields PRO
WP REST API
ACF to REST API

I have a created custom post type called “Custom Navigation”. I have a custom field group (through ACF) called “Custom Navigation Item” that is only applied when the post type is Custom Navigation. The fields in this group are called “Image” and “Caption”, which I can’t get the values for.

This below is my functions.php file which displays my menu but no custom fields.

<?php
/**
 * Twenty Seventeen functions and definitions
 *
 * @link https://developer.wordpress.org/themes/basics/theme-functions/
 *
 * @package WordPress
 * @subpackage Twenty_Seventeen
 * @since 1.0
 */

function custom_setup() {
	// This theme uses wp_nav_menu() in two locations.
	register_nav_menus( array(
		'topnav'    => 'Top Menu',
		'footer-left-nav' => 'Footer Top Menu 1',
		'footer-center-left-nav' => 'Footer Top Menu 2',
		'footer-center-right-nav' => 'Footer Top Menu 3',
		'footer-right-nav' => 'Footer Top Menu 4',
		'footer-bottom-left-nav' => 'Footer Bottom Menu 1',
		'footer-bottom-right-nav' => 'Footer Bottom Menu 2',
	) );

	// Enable the option show in rest
	add_filter( 'acf/rest_api/field_settings/show_in_rest', '__return_true' );

	// Enable the option edit in rest
	add_filter( 'acf/rest_api/field_settings/edit_in_rest', '__return_true' );
}

add_action( 'after_setup_theme', ‘custom_setup' );

function wp_api_v2_custom_get_menu_data ($data) {
   
    if ( ( $locations = get_nav_menu_locations() ) && isset( $locations[ $data['id'] ] ) ) {
	$menu = wp_get_nav_menu_object( $locations[$data['id']] );
	$menuItems = wp_get_nav_menu_items($menu->term_id);

	return $menuItems;
    } else {
    	return array();
    }
}

add_action( 'rest_api_init', function () {
    register_rest_route( 'menus/v1', '/menus/(?P<id>[a-zA-Z(-]+)', array(
        'methods' => 'GET',
        'callback' => 'wp_api_v2_custom_get_menu_data',
    ) );
} );

function custom_nav_post_type() {
	register_post_type(‘custom_nav',
		array (
			'name' 			=> ‘Custom Navigation',
			'singular_name'		=> 'CustomNav',
			'can_export'		=> TRUE,
			'exclude_from_search'	=> FALSE,
			'has_archive'		=> TRUE,
			'hierarchical'		=> TRUE,
			'label'			=> 'Custom Navigation',
			'menu_position'		=> 5,
			'public'			=> TRUE,
			'publicly_queryable'	=> TRUE,
			'query_var'		=> ‘customnav',
			'rewrite'			=> array ( 'slug' => 'shop' ),
			'show_ui'		=> TRUE,
			'show_in_menu'	=> TRUE,
			'show_in_nav_menus'	=> TRUE,
			'show_in_rest'		=> TRUE,
			'rest_base'		=> 'shop',
    			'rest_controller_class'	=> 'WP_REST_Posts_Controller',
			'supports'		=> array ('title')
		)
	);
}

add_action( 'init', 'custom_nav_post_type' );
?>

The output from this is
[{"id":184,"acf":[]},{"id":183,"acf":[]},{"id":182,"acf":[]},{"id":181,"acf":[]},{"id":180,"acf":[]},{"id":176,"acf":[]}]

Any advice on where I am going wrong would be greatly appreciated.

• milkula

• March 28, 2017 at 9:36 pm

Here is how I solved it. I was missing a filter for my custom post type which I added to my “custom_setup” function.

add_filter('rest_prepare_custom_nav', function($response) {
     $response->data['acf'] = get_fields($response->data['id']);
     return $response;
});

So the filter is a wild card filter, applied like

apply_filter("rest_prepare_YOUR-CUSTOM-POST-TYPE-NAME-HERE", ...