Как получить заголовок и изображение избранного поста с помощью JSON API?

Вопрос или проблема

example.com/?json=the_post_thumbnails&count=3

//Добавьте в functions.php, этот хук для моего типа постов 'regions'
add_action( 'rest_api_init', 'create_api_posts_meta_field' );

function create_api_posts_meta_field() {
  register_rest_field( 'regions', 'group', array(
         'get_callback'    => 'get_post_meta_for_api',
         'schema'          => null,
      )
  );
}

//Используйте ID поста для запроса изображения и добавьте его в свой полезный нагрузок.


function get_post_meta_for_api( $object ) {
  $post_id = $object['id'];
  $post_meta = get_post_meta( $post_id );
  $post_image = get_post_thumbnail_id( $post_id );      
  $post_meta["group_image"] = wp_get_attachment_image_src($post_image)[0];


  //var_dump(wp_get_attachment_image($post_image)); die();
  //Разные коды изображений возвращают разные значения, уточните, что вам нужно

  return $post_meta;
}

jQuery.getJSON('/latest-post-as-json/', function(data) {

    jQuery('#externalBlock').append('<h1>'+data.post_title+'</h1>');

    jQuery('#externalBlock').append(data.post_content);



//и так далее

});

Ответ или решение

Для получения заголовка и изображения избранного поста с использованием JSON API в WordPress, необходимо выполнить несколько шагов. Ниже привожу детальное руководство, которое поможет вам правильно настроить API и получить нужные данные.

Шаг 1: Настройка WordPress для использования JSON API

Перед тем как вы сможете получать данные, убедитесь, что у вас установлен и активирован плагин JSON API. После этого вам потребуется зарегистрировать метаполе в вашем API, чтобы добавить заголовок и изображение вашего избранного поста.

Шаг 2: Регистрация метаполей с помощью functions.php

Добавьте следующий код в файл functions.php вашей темы. Этот код регистрирует новое метаполе для типа записи regions, которое будет содержать изображение поста.

// Добавить в файл functions.php
add_action( 'rest_api_init', 'create_api_posts_meta_field' );

function create_api_posts_meta_field() {
    register_rest_field( 'regions', 'group', array(
        'get_callback'    => 'get_post_meta_for_api',
        'schema'          => null,
    ));
}

function get_post_meta_for_api( $object ) {
    $post_id = $object['id'];
    $post_meta = get_post_meta( $post_id );
    $post_image = get_post_thumbnail_id( $post_id );
    $post_meta["group_image"] = wp_get_attachment_image_src($post_image)[0];

    return $post_meta;
}

Шаг 3: Запрос данных с помощью JavaScript

Теперь, когда ваше API настроено, вы можете использовать Ajax-запрос для получения данных о постах. В следующем примере я использую jQuery для получения заголовка и изображения поста.

jQuery.getJSON('/wp-json/wp/v2/regions?per_page=3', function(data) {
    data.forEach(function(post) {
        jQuery('#externalBlock').append('<h1>' + post.title.rendered + '</h1>');

        if(post.group && post.group.group_image) {
            jQuery('#externalBlock').append('<img src="' + post.group.group_image + '" alt="Изображение поста"/>');
        }

        jQuery('#externalBlock').append(post.content.rendered);
    });
});

Шаг 4: Встраивание в HTML

Поместите блок с идентификатором externalBlock в ваше HTML, чтобы отображать заголовок и изображение избранного поста:

<div id="externalBlock"></div>

Примечания

1. Убедитесь, что вы используете правильный URL вашего API. В данном случае используется /wp-json/wp/v2/regions?per_page=3 для получения последних трех постов выбраного типа записи.
2. Если у вас есть специфичные требования к запросам или полям, не забудьте их учесть и настроить API по своему усмотрению.

Заключение

Таким образом, следуя вышеуказанным шагам, вы сможете успешно получить заголовок и изображение избранного поста с использованием JSON API. Убедитесь, что вы тестируете свои запросы и корректно обрабатываете данные на клиентской стороне.