Wp get template part: get_template_part() | Function | WordPress Developer Resources

21.04.2023 alexxlab

Содержание

Шаблоны и части шаблона — полное редактирование сайта

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

Шаблоны — это ваши базовые файлы. Урок начинается с index.html, , а затем вы добавите шаблоны для отдельного поста, страницы, архива и поиска.

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

Для этого полного урока по редактированию сайта вам потребуется:

Установка WordPress с тестовым содержимым.
Плагин Gutenberg, версия 15.1 или новее. — Этот урок был обновлен в рамках подготовки к WordPress 6.2.
Пустая тема, в которую вы добавите файлы шаблонов блоков.

Если вы создали пустую тему на предыдущем уроке, продолжайте использовать ее в этом упражнении.

Если вы еще не настроили тему, вы можете загрузить первую часть файлов урока с GitHub.

Расчетное время чтения: 17 минут

Последнее обновлено

21 февраля 2023 г.

СОДЕРЖАНИЕ

Создание вашего первого шаблона. блок
- Шаблон поста
- Пагинация

Создание единого шаблона поста

Навигация по следующему и предыдущему посту
Добавление области комментариев.
Шаблоны архивов
Настройка страницы результатов поиска
Следующие шаги

Создание первых частей шаблона

Если ваша начальная тема еще не включает папку с именем templates с пустым файлом index.html внутри, создайте их, прежде чем продолжить.

Часть шаблона представляет собой файл HTML, настраиваемый тип записи (wp_template_part) и блок.
Звучит сложно? Думайте о них как о блоках, которые отображают содержимое, которое вы разместили внутри них. Части шаблона не являются обязательными, но они помогают авторам темы структурировать тему с помощью многократно используемых более мелких частей.

Внутри корневой папки темы создайте папку с именем parts . Создайте в этой папке файлы footer.html и header.html .
WordPress будет искать в этой папке действительные файлы, поэтому вы не сможете использовать другое имя папки.

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

В footer.html добавьте общеизвестный кредитный текст нижнего колонтитула:

Объединение шаблонов и частей шаблона

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

Откройте index. html и добавьте две части шаблона :

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

Для этих двух важных ориентиров необходимо использовать правильный HTML-элемент. Добавьте атрибут tagName для

Если вы хотите иметь возможность идентифицировать и нацеливать верхний и нижний колонтитулы с помощью CSS, добавьте пользовательский CSS className :

ClassName атрибут эквивалентен добавлению класса в поле «Дополнительные классы CSS» на расширенной панели боковой панели настроек блока:

Если вы сейчас просматриваете свой веб-сайт, он должен выглядеть примерно так:

Добавление раздела блога

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

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

В index.html между двумя частями шаблона добавьте групповой блок с атрибутом tagName

со значением основной . Затем обновите

до

Если вам интересно, почему внутри этой группы нет внутреннего контейнера, WordPress удалил внутренний контейнер для тем полного редактирования сайта в Gutenberg 10.3.

✋ Настройка типа макета была обновлена в Gutenberg версии 14.1 и WordPress 6.1.

Существует три типа макета:

Ограниченный : Блоки внутри группы располагаются по центру по горизонтали. Ширина блоков — это значение, которое вы добавили к contentSize в файле theme.json.
По умолчанию : Блоки внутри группы выравниваются по левому краю и заполняют контейнер по ширине.
Flex : Используется с вариантами блоков строк и групп стека.

Тип макета заменил предыдущую настройку макета, в которой вы устанавливаете атрибут наследовать на true или false . Я привожу этот пример на случай, если вы хотите создать тему, которая поддерживает версии WordPress ниже 6.1:9.0003

Обновленные параметры макета будут подробно объяснены в следующем уроке.

Блок цикла запроса

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

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

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

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

 
<дел>

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

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

"isLink":true добавит правильную ссылку для каждого сообщения внутри цикла.
В примере кода я решил не отображать аватар автора сообщения, установив для showAvatar значение false:

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

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

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

внутри запроса, но вне шаблона сообщения:

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

Теперь ваш файл index.html должен выглядеть следующим образом:

Передняя часть вашего веб-сайта должна выглядеть примерно так:

Создание единого шаблона сообщения

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

Сохраните копию index.html как single.html в папке templates .
Конечно, вы хотите показать только текущую запись, поэтому вам нужно убрать цикл.
В single.html вы оставили следующий код:

Поскольку это один пост, я также удалил атрибут isLink из заголовка поста.

Чтобы отобразить все содержимое, замените с
:

Эквивалент the_content() в классическом PHP- на основе темы.

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

Если вы хотите добавить дополнительный интервал, Этого можно добиться, добавив отступы, поля или разделители между содержимым и метаинформацией поста:

Переход к следующему и предыдущему сообщению

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

Версия Gutenberg 13. 0 устарела от блока комментариев к записи в пользу нового блока цикла запроса комментариев. С новым блоком у вас гораздо больше контроля над макетом.
Вы можете размещать, добавлять и удалять внутренние блоки, такие как имя автора комментария, дата комментария и ссылка для ответа.

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

Если ваша тема поддерживает WordPress 5.9 и не требует Гутенберга, вам необходимо отображать комментарии с помощью одного блока, называемого комментариями к сообщениям:

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

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

Я предлагаю создать область комментариев под содержимым, внутри

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

 



 Комментарии

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

Я рекомендую начать с добавления блока цикла запроса комментариев в редакторе блоков WordPress, а затем скопировать и вставить код в шаблон в редакторе кода.

Позвольте мне показать вам внутренние блоки по умолчанию:
Во-первых, у вас есть цикл запросов комментариев, который является родительским блоком, и шаблон комментариев: