Био-бокс автора под статьей

Об авторе
Автор блога
Андрей WPM

Информация об авторе в конце статьи.

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

Сразу предупрежу, если вы с кодом вообще не знакомы, этот способ может показаться для вас тяжелым. Если вам не нравятся ручные манипуляции, можете воспользоваться специальным плагином. Благо, их сейчас предостаточно в открытом доступе. Советую присмотреться к плагину Simple Author Box. Есть и другие, похожие плагины, просто введите в админке в поиск "author box" и выбирайте из предложенных вариантов.

Ну а для тех, кто всё же решительно настроен, читаем дальше. Вдохновителем для этой статьи, выступает одна из моих читательниц с ником - Мурмур 🙂 , от части, этот пост для неё. Ну и для других конечно же, тоже!

Итак, сегодня мы с вами создадим простой блок с информацией об авторе и его аватаром и внедрим его в конец каждой статьи на блоге. Для этого, нам понадобиться:

  1. Желание вникнуть в процесс внедрения.
  2. Немного знаний по разметке HTML.
  3. Примерное понимание структуры папок WP.
  4. Желательно копия сайта на локальном сервере.
  5. Ну и конечно же, WPMaster!

Ну что ж, давайте приступим к внедрению?

 

Подготовка к внедрению блока об авторе.

Если вы впервые собираетесь что-то внедрять в шаблон своего сайта, то делать это на рабочем ресурсе не рекомендуется. Да и вообще, если вы не особо этими делами увлекаетесь, то нужно проводить такие эксперименты на локальном сервере. Просто установите OSPanel на ваш компьютер, перенесите на него ваш сайт и уже тут, проводите эксперименты. Так, ваш сайт останется в рабочем состоянии в случае ошибки. И вам не придется впопыхах искать причину поломки.

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

 

Поиск файла вывода статей.

Итак, для начала, вам нужно найти файл, отвечающий за вывод записи на вашем сайте. Стандартных файлов в WordPress'е всего существует три:

  1. Content.php - обычно, этот файл выводит ленту блога, но иногда и сам пост.
  2. Content-single.php - чаще всего, выводит именно отдельную запись (то что нужно).
  3. Single.php - очень редко через него выводят записи, но я такое встречал.

Но бывает, эти файлы не в корне темы находятся, а например в папках inc или template-parts. Так что, поищите эти файлы, они должны присутствовать в вашем шаблоне. В первую очередь, ищите файл со второго пункта.

 

Поиск функции вывода статей.

После того, как нашли нужный файл, вам нужно в нём найти функцию, отвечающую за вывод самой записи. Их существует всего 2 в природе ВП:

  1. the_content(); - Выводит саму запись на экран.
  2. get_the_content(); - Возвращает запись в переменную.

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

Кстати, для редактирования файлов на сервере, я использую свой любимый редактор Notepad++. О том, как подключить его через FTP к серверу, я писал ранее. Рекомендую ознакомиться.

Как только вы нашли нужную функцию, можете переходить ко второму шагу - внедрению.

 

Внедрение био-бокса автора в статьи.

На самом деле, блок с информацией об авторе достаточно простой. Использует он всего три функции:

  • get_avatar( get_the_author_meta( 'user_email' ), '100' ); - Выводит аватар автора статьи.
  • the_author_meta( 'display_name' ); - Выводит имя или никнейм автора статьи.
  • the_author_meta( 'description' ); - Выводит описание автора, заполняется в админке.

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

 

Html код бокса об авторе.

 

Этот код находится прямо под функцией the_content(); которая выводит пост. Если вы хотите, чтобы бокс автора выводился вначале статей, то его нужно будет поместить перед этой функцией. Ниже на скриншоте показано более детально, где внедрен этот бокс автора.

Блок об авторе
Внедренный блок об авторе под статьей

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

Данный блок будет выводиться под каждой статьей автоматически. Но перед этим, вам нужно будет заполнить поля информации в админке ВордПресса. Переходите по пути "Пользователи > Ваш профиль" и там прописываете нужное вам имя и описание, выглядит это вот так:

Обо мне
Информация обо мне в админке

Что касается аватаров. Можно поступить двумя способами:

  1. Зарегистрироваться на сервисе Граватар и привязать к вашему емайлу картинку.
  2. Заменить функцию < ?php echo get_avatar( ... ); ? > на любую картинку < img src="" alt="Био-бокс автора под статьей" >.

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

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

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

 

Css стили блока с информацией.

 

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

Андрей WPM
Опубликовал - Андрей WPM

Автор и создатель этого блога. Интересуюсь вебмастерингом, блогингом и всем что с этим связано. Предпочитаю CMS WordPress и советую вам.





Оставить комментарий

avatar
1000
  Подписаться  
Уведомление о