ВУЗ: Не указан
Категория: Не указан
Дисциплина: Не указана
Добавлен: 11.12.2023
Просмотров: 124
Скачиваний: 1
СОДЕРЖАНИЕ
1. Установка и первоначальная настройка CMS WordPress
1.3 Первоначальная настройка CMS WordPress
1.4 Знакомство с интерфейсом CMS WordPress
2.2 Откуда взять дополнительные темы?
3. Автоматизация вывода информации о сайте
3.1 Информация о сайте в секции «Head»
3.2 Информация о сайте теге в «Header» секции «Body»
№ 5 Регистрация и вывод сайдбара в теме для WordPress
№ 6 Шаблоны контента в теме для WordPress
№ 8 Перенос сайта и размещение на хостинге
8.1. Создание резервной копии сайта, находящегося под управлением CMS WordPress
8.2 Перенос сайта, находящегося под управлением CMS WordPress на другой локальный web-сервер
8.3 Размещение сайта, находящегося под управлением CMS WordPress на хостинговой площадке
За вызов изображения записи на странице отвечает функция «the_post_thumbnail('thumbnail')», добавьте её в файле «single.php» в месте вывода изображения записи (рисунок 7.6) и обновите страницу.
|
Рисунок 7.6 – Вывод изображения записи в файле «single.php» |
После обновления страницы, сразу после идущего блока заголовка записи, будет выведено изображение записи, но его размер не соответствует макету вёрстки. Для его изменения нам либо необходимо изменить её размер в консоли администратора (настройки – медиафайлы – размер миниатюры), либо добавить свой собственный размер миниатюры в разрабатываемой теме. За реализацию данной возможности в WordPress существует функция «add_image_size()» 10. Данную функцию также следует вызвать в момент активации темы и регистрации меню сайта, учитывая при этом, что требуемый нам размер миниатюры 615px по ширине и 410px по высоте, имя создаваемой миниатюры будет «post_thumb», а параметр «true» будет отвечать за принудительную обрезку изображения до указанных размеров (рисунок 7.7).
|
Рисунок 7.7 – Регистрация новой миниатюры с заданным именем и размерами |
После регистрации новой миниатюры необходимо изменить имя вызываемой миниатюры в файле «single.php» (рисунок 7.8) и после обновления страницы отображение миниатюра будет соответствовать первоначальной разметке.
|
Рисунок 7.8 – Вызов изображения записи в файле «single.php» с именем миниатюры «post_thumb» |
Следующим по вёрстке идет блок контента, на данный момент в нем расположены три параграфа текста, удалите их заменив использованием функции «the_content» (рисунок 7.9).
|
Рисунок 7.9 – Вывод основного контента поста на страниц «single.php» |
После обновления страницы в браузере на ней должен отобразиться основной контент поста.
Далее по вёрстке идет вывод тегов поста, за их вывод в WordPress отвечает функция «the_tags»11. Для автоматического вывода тегов поста, замените код параграфа с классом «tags» на вызов функции «the_tags», так как это показано на рисунке 7.10.
|
Рисунок 7.10 – Вывод тегов на страницу поста «single.php» |
Последним элементом, идущим в составе единичного поста, является навигация к предыдущему и следующему постам, за такую навигацию в WordPress отвечает функция «the_post_navigation»12. В нашем случае требуется немного изменить стандартный вывод таких ссылок, для простоты выполнения скопируйте по ссылке: https://wp-kama.ru/function/the_post_navigation пример использования функции и произведите доработку кода в соответствии с рисунком 7.11.
|
Рисунок 7.11 – Вывод навигации к предыдущему и следующему постам в файле «single.php» |
После закрытия маркированного списка «ul» с классами «post-nav» и «group» заканчивается тег «article» а, следовательно, и вывод поста
Ниже идет вывод комментариев и форма для добавления нового комментария, вывод этих элементов мы произведем несколько иначе чем это задумано разработчиком темы.
Перенесите все содержимое блока с идентификатором «comments» в отдельный файл и назовите его «temp.php» (этот код будет необходим при оформлении формы добавления комментариев, и чтобы его не потерять мы переместим его в отдельный документ).
В блоке с идентификатором «comments» мы должны разместить код позволяющий проверить открыта ли вообще на сайте возможность комментирования, и в случае успеха WordPress должен «подгрузить» файл шаблона комментариев (рисунок 7.12). Сам файл мы должны создать в корне разрабатываемой темы и назвать его «comments.php».
|
Рисунок 7.12 – Проверка возможности комментирования на сайте |
Перед тем как выводить комментарии, нужно удостовериться в их наличии, т.е. произвести проверку, если есть —
вывести полный список, если нет — то можно, например, показать пользователю фразу «Комментарии отсутствуют». Так читателю поста будет понятнее, что никто еще ничего не писал, но возможность комментирования существует.
Для осуществления такой проверки необходима реализация конструкции if/else с использованием функция вывода количества комментариев «get_comments_number». В том случае, если функция возвращает 0 (ноль), то выводим «Комментарии отсутствуют», иначе выводим фразу «Комментарии к посту», ну а если оба условия не выполняются, то нам будет выведена фраза «Обсуждения закрыты для данной страницы». Код такого условия, приведен на рисунке 7.13, обратите внимание на то, что код проверки должен быть в файле шаблона вывода комментариев «comments.php».
|
Рисунок 7.13 – Проверка возможности комментирования, количества уже оставленных комментариев к посту в файле «comments.php» |
На данном этапе разработки шаблона комментариев, будет выведен заголовок в зависимости от настроек CMS WordPress и оставленных комментариев, самого же вывода комментариев нет. Для того, чтобы вывести комментарии на нашей странице при помощи шаблона комментариев, нам необходимо воспользоваться возможностями функции «wp_list_comments()»13.
Сама по себе функция отвечает за вывод комментариев, оставленных к постам или страницам, и может принимать ряд параметров, в нашем же случае нужны параметр «style» и «avatar_size». Все элементы массива комментариев будут обрамлены в нумерованный список «ol» с классом «commentlist», так как это соответствует нашей верстке (проверьте в файле temp.php), а размер аватара (судя всё по той же верстке) 50*50 пикселей. Сам код функции должен быть помещен в условии, проверяющем наличие комментариев, в случае его успешного выполнения (см. рисунок 7.14).
|
Рисунок 7.14 – Вывод комментариев в файле шаблона |
Последнее, что нам остается сделать, это вывести форму для добавления нового комментария, для выполнения этой задачи в WordPress существует функция «comment_form()»
14. Эту функцию необходимо вызвать сразу после вывода комментариев в файле «comments.php» (см. рисунок 7.15).
|
Рисунок 7.15 – Вывод формы добавления комментариев в файле «comments.php» |
Данная функция выведет форму «по умолчанию», но для неё существует пример использования, скопируйте этот пример и самостоятельно, обращая внимание на файл «temp.php» произведите адаптацию этого примера с использованием тегов, классов и идентификаторов, используемых ранее в вёрстке.
Кроме того, Вам понадобится изменить порядок полей формы, для этого отлично может подойти функция фильтрации и пересортировки содержимого которая изображена на рисунке 7.1615. Разместить её необходимо в том же файле «comments.php» перед вызовом формы комментирования.
|
Рисунок 7.16 – Фильтрация и переопределение полей ввода в форме комментариев |
После проведенных действий по приведению внешнего вида формы в соответствии с макетом удалите временный файл «temp.php» и проверьте работоспособность возможности оставлять комментарии к записям.
За вывод отдельных страниц сайта в теме WordPress, как уже и говорилось, отвечает файл «page.php». По своему содержанию он мало чем отличается от файла «single.php», скопируйте этот файл и переименуйте его в файл «page.php». Откройте файл для редактирования и удалите в нём следующие его части:
1. Весь блок с классом «entry-content-media», т.к. вывод изображения страницы как это было в случае записи нам не нужен;
2. Весь параграф с классом «tags», т.к. вывод тегов на странице тоже не требуется;
3. Маркированный список с классами «post-nav group», т.к. навигация между предыдущими и следующими страницами не нужен;
4. Блок с идентификатором «comments», т.к. комментирование страниц не необходимо;
5. В маркированном списке, находящемся в заголовке содержимого страницы, удалите элемент списка «li» с классами «category tag» и идущий перед ним элемент «span», т.к. вывод рубрики и тегов страницы также не нужен.
На этом, правка данного файла завершена, а в теме присутствует полноценный файл для вывода содержимого страницы.
Произведите действия по созданию файла, отвечающего за вывод отдельной записи (single.php). Не забудьте реализовать функциональные возможности добавления изображения записи. В случае необходимости произведите дополнительную стилизацию элементов. Выведите на странице записи комментарии и форму комментирования. Добейтесь полного соответствия с макетом верстки. По аналогии с действиями, выполняемыми в практической работе выполните создание файла page.php.