Блок цикла запросов в WordPress: руководство, советы и рекомендации

Опубликовано: 2023-04-11

Цикл запросов — это аккуратный блок WordPress, который позволяет отображать список связанных сообщений блога, продуктов и страниц. Как новичок, вам может быть интересно, как воспользоваться этой функцией.

К счастью, блок Query Loop относительно прост в использовании. Вы можете выбрать свой любимый готовый макет или создать что-то с нуля. Кроме того, вы можете настроить отображение ваших вложенных блоков и полностью настроить дизайн.

В этом посте мы более подробно рассмотрим блок Query Loop в WordPress. Затем мы покажем вам, как использовать блок, и поговорим о конкретных случаях использования.

Что такое блок цикла запросов в WordPress?

Блок Query Loop — это инструмент, который позволяет пользователям WordPress отображать динамический список сообщений на основе определенных атрибутов. Например, его можно настроить на циклический просмотр всех сообщений определенной категории с отображением заголовка сообщения и изображения каждого из них.

Этот блок может быть довольно технически сложным для настройки. В результате новички, как правило, избегают его использования и вместо этого выбирают блок «Список сообщений», который представляет собой более простую версию цикла запросов.

Хотя блок Query Loop является более сложным, он также обеспечивает большую гибкость. Например, вы можете создать страницу со своими лучшими рецептами или продемонстрировать портфолио проектов.

Когда использовать блок Query Loop в WordPress

Блок Query Loop предоставляет множество возможностей для продвижения вашего контента. Вот некоторые из результатов, которых вы можете достичь с его помощью:

  • Создайте раздел связанных сообщений для своего блога, в котором укажите заголовок сообщения, отрывок и изображение.
  • Показывайте контент из настраиваемых типов сообщений, таких как отзывы или элементы портфолио.
  • Отображение сообщений одного и того же тега или категории.
  • Показать связанные продукты WooCommerce.
  • Отображение сетки товаров, сгруппированных по цене.
  • Перечислите компании по местоположению в бизнес-каталоге.
  • Перечислите обзоры книг в соответствии с определенным звездным рейтингом.

Это лишь некоторые примеры. Блок Query Loop можно настроить множеством способов.

Как использовать блок цикла запросов в WordPress

Чтобы начать работу с блоком Query Loop, вам нужно перейти к публикации или странице, где вы хотите его использовать. Затем нажмите + , чтобы добавить новый блок, и найдите Query Loop .

найти блок цикла запроса в WordPress

Вы также можете вставить блок с помощью селектора шаблона блока. Переключитесь на Patterns и выберите Query из выпадающего меню. Затем выберите предпочитаемый макет.

выбор макета для блока цикла запроса

Существует множество макетов цикла запросов на выбор. Например, вы можете представить свои сообщения в виде сетки с изображением слева или придерживаться формата по умолчанию.

Либо нажмите «Начать пустой» , чтобы создать цикл запросов с нуля и получить полный контроль над дизайном вашего контента.

начиная с пустого цикла запроса

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

выбор варианта цикла запроса

Независимо от того, создали ли вы свой блок с нуля или использовали шаблон, вы увидите предварительный просмотр своего блока в редакторе.

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

Блок цикла запросов состоит из нескольких различных подблоков, таких как заголовки сообщений, рекомендуемые изображения и многое другое. Если щелкнуть значок «Параметры отображения» на панели инструментов, можно настроить количество элементов на странице.

настройки цикла запросов для фида

Вы также можете использовать настройки блока на панели справа для дальнейшей настройки цикла запросов. Вы можете изменить порядок своих элементов, создать новые сообщения для своей ленты, применить фильтры, изменить цвета и многое другое.

Какие подблоки находятся в блоке Query Loop?

В блоке Query Loop вы найдете несколько подблоков, сгруппированных вместе. Хотя они содержат слово «публикация» в своих именах, они также могут применяться к другому контенту, такому как страницы, элементы портфолио или продукты.

Рассмотрим каждый подблок.

1. Заголовок сообщения

В блоке «Заголовок сообщения» отображается заголовок каждого сообщения. Вы можете преобразовать заголовок в ссылку и настроить шрифт и цвет в настройках блока.

2. Дата публикации

С помощью этого блока вы можете показать дату публикации вашего контента. Вы можете изменить формат по умолчанию, показать дату последнего изменения и ссылку на публикацию в настройках.

3. Опубликовать контент

Блок «Контент публикации» представляет весь контент из вашего поста или страницы в блоке «Цикл запросов». Это может сделать ваш блок очень длинным, что может оттолкнуть посетителей.

4. Опубликовать отрывок

Post Excerpt отображает сводку каждой части контента. Посетители смогут просмотреть ваш отрывок и найти ссылку «Подробнее». Вы можете добавить эту ссылку на новую строку или в конец отрывка. Кроме того, вы можете изменить текст привязки, изменить цвет ссылки и выбрать новый размер шрифта.

5. Опубликуйте избранное изображение

Если вы решите включить этот блок в свой цикл запросов, вы будете отображать избранное изображение для своих сообщений или продуктов. Кроме того, вы можете включить ссылку с вашим изображением, чтобы при нажатии посетители направлялись к фрагменту контента.

6. Категории постов

Добавив блок «Категории записей» в свой цикл запросов, вы можете отобразить категории, связанные с этой частью контента. Это отличный способ отображать сообщения в блогах, посвященные похожей теме или продуктам в той же категории. Вы также можете изменить цвет и шрифты в настройках.

7. Почтовые теги

Блок «Теги публикации» позволяет отображать теги, добавленные к вашему сообщению. Это еще один полезный способ продемонстрировать похожий контент.

8. Пагинация (предыдущий пост и следующий пост)

Разбивка на страницы — один из самых ценных блоков для добавления в ваш цикл запросов, поскольку он отображает ссылки на ваши предыдущие или следующие сообщения. Пагинация состоит из трех отдельных блоков:

  • Предыдущий
  • Номера страниц
  • Следующий

Чтобы использовать его, вам сначала нужно выбрать блок шаблона сообщения, используя представление списка. Затем вы можете нажать + , чтобы добавить блок разбиения на страницы.

9. Автор сообщения

Как следует из названия, в Post Author отображаются сведения об авторе, такие как имя автора, аватар и биография. Если вы решите включить этот блок, вам нужно будет выбрать пользователя в раскрывающемся меню в настройках блока. Здесь вы также можете настроить видимость аватара, изменить размер аватара, показать/скрыть биографию автора, а также изменить цвет и размеры.

10. Опубликовать биографию автора

Если вы не хотите включать свое имя автора и аватар в свой цикл запросов, но хотите, чтобы биография автора была видна, тогда этот блок для вас. Все ваши посетители смогут увидеть биографию. Кроме того, вы можете настроить его внешний вид, изменив размер, шрифт и цвет.

Примеры использования блока Query Loop

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

1. Создайте раздел «последние сообщения»

Этот раздел может сделать ваш недавно опубликованный контент более заметным.

блок цикла запросов настроен для отображения последних сообщений

Для начала вам нужно будет использовать два блока Query Loop. Добавьте свой первый, затем выберите шаблон или начните с нуля. Для визуальных сообщений, таких как рецепты, изображение, дата и заголовок могут быть хорошим выбором.

параметры цикла запроса

Если вы уже настроили цикл запросов, ваши сообщения будут отображаться здесь. Если нет, нажмите «Создать новую публикацию для этой ленты» , чтобы написать и опубликовать записи, которые вы хотите включить.

Так как именно здесь будет находиться ваша последняя запись, вам нужно отобразить только один фрагмент контента. Перейдите к настройкам дисплея . Рядом с ПУНКТАМИ НА СТРАНИЦЕ введите «1».

выбор одного поста для ленты

Теперь вы должны видеть в блоке только свое последнее сообщение.

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

установка представления сетки для блока цикла запроса

Теперь нажмите «Настройки дисплея» и измените значение «СМЕЩЕНИЕ» на «1». Это удалит ваш последний пост из второго блока цикла запросов.

установка значения смещения для блока цикла запроса

Кроме того, вы можете настроить макет вашего блока. Например, вы можете уменьшить размер шрифта заголовков, чтобы улучшить читаемость текста. Вы можете сделать это с панели инструментов.

настройки заголовков постов в блоге

Вы также можете уменьшить размер даты. Вы можете внести эти изменения в настройках блока. Найдите типографику и выберите более подходящий размер шрифта.

настройка размера шрифта даты публикации

Вы также можете установить новые размеры для избранных изображений и изменить выравнивание названий ваших рецептов. Когда будете готовы, нажмите «Сохранить черновик» или «Опубликовать».

2. Добавьте блок Query Loop в шаблон индекса.

Если вы используете блочную тему, вы можете добавить блок Query Loop в шаблон. Это может пригодиться при настройке глобальных стилей для циклов запросов и их подблоков.

В панели управления WordPress перейдите в раздел «Внешний вид» → «Редактор» .

добавление блока цикла запроса на страницу индекса

Нажмите раскрывающееся меню, для которого в настоящее время установлено значение «Главная» или «Страница» (в зависимости от вашей темы), и выберите Просмотреть все шаблоны .

выбор шаблона страницы для редактирования

Из списка шаблонов выберите тот, который хотите отредактировать. Шаблон индекса , как правило, является хорошим вариантом, поскольку именно он индексирует и отображает сообщения веб-сайта.

набор из трех постов в блоге на шаблоне индексной страницы

Если вы выберете Index , вы обнаружите, что шаблон уже поставляется с блоком Query Loop, но вы можете удалить его и добавить свой собственный. Затем вы можете настроить макет, переключаясь между представлением списка и представлением сетки.

Вы также можете настроить текст «Подробнее», щелкнув подблок и введя предпочитаемый призыв к действию.

редактирование дизайна поста в блоге

Вы также найдете все доступные настройки блока, если перейдете на панель инструментов и щелкните Показать дополнительные настройки. Здесь вы можете изменить размер и цвет текста, а также установить новые размеры для ваших изображений.

3. Установите глобальные стили для блоков цикла запросов.

Если вы планируете часто использовать блоки цикла запросов на своем сайте, создание и настройка цикла может занять много времени снова и снова. Вот почему рекомендуется устанавливать глобальные стили для циклов запросов и вложенных блоков.

Чтобы получить доступ к глобальному редактору стилей, щелкните значок «Стили» в правом верхнем углу экрана:

выбор глобальных стилей для блока

Затем выберите «Блоки» в нижней части боковой панели:

выбор параметра «Блоки» для глобальных стилей

Прокрутите список доступных блоков и найдите Query Loop. Затем нажмите «Цвета» :

поиск настроек цвета для блока цикла запроса

Здесь вы можете управлять цветовыми схемами различных элементов и блоков на вашем сайте. Если вы хотите добавить больше пользовательских цветов в палитру по умолчанию, нажмите «Палитра» и найдите «CUSTOM» .

Теперь нажмите на + , чтобы добавить новые цвета в палитру.

добавление цветов в цветовую палитру

Затем вернитесь к цветам цикла блока запроса. Вы увидите список таких элементов, как фон, ссылки и заголовки.

Вы также можете установить стили по умолчанию для этих компонентов. Для этого выберите элемент, который хотите отредактировать.

выбор из цветовой палитры

Например, вы можете изменить цвет фона блоков цикла запросов.

изменение цвета фона

Если вы решите отказаться от каких-либо изменений, которые вы применяете, просто нажмите «Очистить».

Вы также можете установить глобальные стили для фона и цвета текста заголовков. Кроме того, вы можете назначать цвета при наведении для ваших ссылок. Когда вы закончите, нажмите «Сохранить» , чтобы применить новые стили по умолчанию к вашим блокам.

Расширьте блок цикла запросов

Хотя теперь вы знаете, как создавать и настраивать блок Query Loop в WordPress, возможно, вам захочется еще больше расширить этот блок. Используя Block Variations API, вы можете указать определенные настройки по умолчанию, отключить параметры настройки и многое другое.

Например, вы можете никогда не использовать атрибут Sticky в своем цикле запросов. Поле «Автор» также может не иметь отношения к вашим сообщениям. Поэтому вы можете отключить эти элементы управления, чтобы они не были видны.

В этом случае код варианта будет выглядеть так:

 { /** ...variation properties */ allowedControls: [ 'inherit', 'order', 'taxQuery', 'search' ], }

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

В качестве альтернативы вы можете скрыть параметр поиска для пользователей, и в этом случае ваше свойство будет выглядеть следующим образом:

 { /** ...variation properties */ allowedControls: [ 'inherit', 'postType', 'order', 'sticky', 'taxQuery', 'author', ], }

Если по какой-либо причине вы хотите скрыть все доступные элементы управления для вашего блока Query Loop, вы можете установить пустой массив рядом с полем allowControls.

Как видите, этот метод требует некоторых технических знаний. Если у вас нет навыков кодирования, вы можете придерживаться параметров настройки, доступных в редакторе блоков.

Часто задаваемые вопросы

Хотя мы попытались охватить все аспекты блока Query Loop, у вас могут возникнуть вопросы об этой функции. Давайте рассмотрим самые распространенные из них.

Что такое запрос WordPress?

Query переводится как «спрашивать» или «командовать». Таким образом, в блоке Query Loop часть «Query» позволяет пользователям запрашивать определенную информацию для включения в цикл. Вот как цикл запросов отображает все сообщения или страницы для определенного тега, категории и т. д.

Что такое цикл WordPress?

Цикл WordPress — это способ отображения схожей информации в циклическом формате. Например, вы можете создать цикл сообщений в блоге, которые будут отображать связанные статьи на вашей странице, показывая заголовок сообщения, отрывок, избранное изображение и многое другое.

Данные извлекаются из вашего опубликованного контента и помещаются в цикл, который находится на ваших страницах для посетителей. Таким образом, это помогает вам направлять пользователей к другим релевантным фрагментам контента и поддерживать интерес посетителей к вашему сайту.

Что вы можете сделать с блоком Query Loop?

С блоком Query Loop можно добиться многого. Например, вы можете показать список связанных или рекомендуемых продуктов.

Кроме того, вы можете направлять пользователей к другим рецептам на вашем сайте, которые имеют те же теги или категории. Для веб-сайта портфолио вы даже можете продемонстрировать свою последнюю или лучшую работу в блоке цикла запросов.

Как вы можете расширить блок Query Loop?

Вы можете получить подробный контроль над тем, как отображается ваш цикл запросов, добавив в блок пользовательские настройки. С помощью Block Variations API вы можете создавать новые функции, отключать определенные элементы и применять собственные пресеты.

Создайте блок цикла запросов в WordPress.

Блок Query Loop — это полезный блок WordPress, который позволяет отображать избранные сообщения, связанные страницы или продукты определенной категории. Вы также можете использовать его для отображения контента из пользовательских типов сообщений, таких как отзывы и проекты портфолио.

Блок Query Loop очень настраиваемый. Вы можете настроить подблоки внутри него, такие как заголовок сообщения, имя автора и избранные изображения. Кроме того, вы можете расширить блок и добавить собственные настройки с помощью API вариантов блоков.

Еще один способ помочь посетителям найти нужный контент на вашем сайте — использовать поиск Jetpack. Идеально подходит для крупных веб-сайтов, вы можете предоставлять мгновенные результаты поиска и использовать мощные фильтры для повышения удобства пользователей. Начните работать с Jetpack Search уже сегодня!