Как добавить произвольный паттерн в цикл запроса?

Ссылка скопирована
1 ответ

При работе с циклом запроса(query loop) в гутенберге доступно на выбор один из нескольких 6 паттернов(Standard, Image at left, Small image and title, Grid, Large title, Offset).
Подскажите, пожалуйста, как создать произвольный паттерн и сделать его доступным для выбора из общего списка паттернов?

Как добавить произвольный паттерн в цикл запроса?

Дополнительно:

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Алексей Денисов Ответ

Для Query Loop в Gutenberg нужно зарегистрировать свой block pattern. После регистрации он появится в списке паттернов, доступных при выборе макета цикла запроса. Делается это через register_block_pattern() на хуке init.

add_action('init', function () {
    register_block_pattern_category('site-query', [
        'label' => __('Паттерны запросов сайта', 'textdomain'),
    ]);
 
    register_block_pattern('site/custom-query-card', [
        'title' => __('Карточки записей сайта', 'textdomain'),
        'description' => __('Произвольный паттерн для Query Loop.', 'textdomain'),
        'categories' => ['query', 'site-query'],
        'blockTypes' => ['core/query'],
        'content' => '<!-- wp:query {"query":{"perPage":6,"postType":"post"}} -->
<div class="wp-block-query">
<!-- wp:post-template {"layout":{"type":"grid","columnCount":3}} -->
<!-- wp:group {"className":"custom-query-card"} -->
<div class="wp-block-group custom-query-card">
<!-- wp:post-featured-image {"isLink":true} /-->
<!-- wp:post-title {"isLink":true,"level":3} /-->
<!-- wp:post-excerpt {"moreText":"Подробнее"} /-->
</div>
<!-- /wp:group -->
<!-- /wp:post-template -->
</div>
<!-- /wp:query -->',
    ]);
});

add_action('init', function () { register_block_pattern_category('site-query', [ 'label' => __('Паттерны запросов сайта', 'textdomain'), ]); register_block_pattern('site/custom-query-card', [ 'title' => __('Карточки записей сайта', 'textdomain'), 'description' => __('Произвольный паттерн для Query Loop.', 'textdomain'), 'categories' => ['query', 'site-query'], 'blockTypes' => ['core/query'], 'content' => '<!-- wp:query {"query":{"perPage":6,"postType":"post"}} --> <div class="wp-block-query"> <!-- wp:post-template {"layout":{"type":"grid","columnCount":3}} --> <!-- wp:group {"className":"custom-query-card"} --> <div class="wp-block-group custom-query-card"> <!-- wp:post-featured-image {"isLink":true} /--> <!-- wp:post-title {"isLink":true,"level":3} /--> <!-- wp:post-excerpt {"moreText":"Подробнее"} /--> </div> <!-- /wp:group --> <!-- /wp:post-template --> </div> <!-- /wp:query -->', ]); });

Ключевые моменты:

  • categories должен содержать query, чтобы паттерн был связан с Query Loop;
  • blockTypes указывает, что паттерн относится к core/query;
  • content должен быть валидной block-разметкой Gutenberg, а не обычным PHP-шаблоном.

Удобнее сначала собрать нужный Query Loop в редакторе, затем переключиться в режим «Редактор кода», скопировать block-разметку и вставить её в content. Так меньше риск ошибиться в синтаксисе комментариев блоков.

Код регистрации лучше держать в теме или отдельном плагине. Если это проектная библиотека паттернов, отдельный мини-плагин будет надёжнее: паттерны не пропадут при смене темы.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно

woocommerce Как отображать при фильтрации товары со значением search параметра visibility: HUSKY — Products Filter for WooCommerce? 0 ответов VPN Почему подключение через VPN работает только на wi-fi, а через кабель нет, где ошибка? 0 ответов Safari Почему снова флагнули домен в safari? 0 ответов Telegram Как диагностировать ошибку с подключением к прокси в мобильном приложении Telegram? 0 ответов