WordPress API | Get Featured Image URL
Today i was made some experiment with WordPress REST API, all it’s right till i want do get Feateured image URL.
By default wordpress expose Feature image ID instead of URL in API.
"featured_media": 25,That’s is problem, because, for fetch post you need to do two call, first for get the single post API and one for get single post featured image form “featured_media” ID.
It’s more practise have Feature Image Url ( and links ) exposed in API.
For do that, open the function.php of your theme and add this snippet :/* Add featured image to REST API */ add_action('rest_api_init', 'register_rest_images' ); function register_rest_images(){ register_rest_field( array('post'), 'fimg_url', array( 'get_callback' => 'get_rest_featured_image', 'update_callback' => null, 'schema' => null, ) ); } function get_rest_featured_image( $object, $field_name, $request ) { if( $object['featured_media'] ){ $img = wp_get_attachment_image_src( $object['featured_media'], 'app-thumb' ); return $img[0]; } return false; }Basically we go to add “fimg_url” directly to wordpress API.
reload post end point and you see something like this:
"fimg_url": "http://localhost/wpTest/wp-content/uploads/2019/12/847d7f84606089.5d62962644b12.jpg", "_links": { "self": [ { "href": "http://localhost/wpTest/wp-json/wp/v2/posts/64" } ], "collection": [ { "href": "http://localhost/wpTest/wp-json/wp/v2/posts" } ], "about": [ { "href": "http://localhost/wpTest/wp-json/wp/v2/types/post" } ], "author": [ { "embeddable": true, "href": "http://localhost/wpTest/wp-json/wp/v2/users/1" } ], "replies": [ { "embeddable": true, "href": "http://localhost/wpTest/wp-json/wp/v2/comments?post=64" } ], "version-history": [ { "count": 15, "href": "http://localhost/wpTest/wp-json/wp/v2/posts/64/revisions" } ], "predecessor-version": [ { "id": 92, "href": "http://localhost/wpTest/wp-json/wp/v2/posts/64/revisions/92" } ], "wp:featuredmedia": [ { "embeddable": true, "href": "http://localhost/wpTest/wp-json/wp/v2/media/25" } ], "wp:attachment": [ { "href": "http://localhost/wpTest/wp-json/wp/v2/media?parent=64" } ], "wp:term": [ { "taxonomy": "category", "embeddable": true, "href": "http://localhost/wpTest/wp-json/wp/v2/categories?post=64" }, { "taxonomy": "post_tag", "embeddable": true, "href": "http://localhost/wpTest/wp-json/wp/v2/tags?post=64" } ], "curies": [ { "name": "wp", "href": "https://api.w.org/{rel}", "templated": true } ] }From now you can call featured image as:
<img class="img-fluid" src="post.fimg_url" />;That’s all.