Когда пользователь впервые заходит на веб-сайт, он может быстро покинуть страницу. Существует множество методов, помогающих удержать его внимание. Одним из таких методов является показ среднего времени, необходимого для чтения материала. В данной статье будет рассмотрено, как самостоятельно вывести время чтения статьи на платформе WordPress для любого сайта.
Как считается показатель времени чтения?
Среднее время на чтение — это расчет того, сколько минут потребуется обычному читателю для полного ознакомления с текстом. Этот показатель можно легко вычислить по следующей формуле: общее количество слов в тексте делится на среднюю скорость чтения.
По исследованиям, взрослый читатель русского языка способен прочитать от 120 до 180 слов за минуту. Это время может варьироваться в зависимости от сложности текста.
Для чего нужно указывать время прочтения статьи на сайте?
Отображение времени чтения может значительно улучшить опыт пользователей и усилить заинтересованность аудитории, что положительно скажется на общем состоянии сайта.
Некоторые преимущества этой функции:
Комфорт для посетителей. Если информация о времени чтения видна с самого начала, читатели могут легко принять решение, готовы ли они потратить указанное количество минут на ознакомление с материалом на вашем сайте.
Снижение уровня отказов и высокая вовлеченность. Если на сайте размещены короткие статьи, которые можно прочитать всего за 3–5 минут, будет больше шансов, что посетитель останется, чтобы найти ответ на свой вопрос.
Улучшение позиций в поисковых системах. Поведенческие факторы оказывают существенное влияние на ранжирование сайта в Google и Яндекс, особенно по запросам средней и высокой частоты. Как уже упоминалось, отображение времени чтения может помочь удержать посетителя.
Как отобразить время на чтение статьи в WordPress плагином
Когда возникает необходимость добавить функционал на сайт WordPress, многие сразу думают о плагинах. В репозитории WordPress можно найти несколько решений, которые позволяют выводить время чтения статьи. Рассмотрим несколько из них.
Имейте в виду, что каждый новый плагин добавляет нагрузку на проект.
Reading Time & Progress Bar
Reading Time & Progress Bar — это один из наиболее функциональных бесплатных плагинов для добавления времени на чтение на вашем сайте. Он не только предоставляет информацию о времени, необходимом для ознакомления с материалом, но и добавляет прогресс-бар для удобства читателя.
После установки плагина в меню администраторов появится новый пункт, где настраиваются простые, но мощные параметры.
Некоторые примечательные особенности плагина:
Выбор материалов, для которых будет выводиться время на чтение и прогресс-бар. Поддерживаются как стандартные таксономии, так и те, что были созданы другими плагинами, темами или пользователями.
Возможность задать количество слов, которое можно прочитать за минуту, включая слова из комментариев или описания изображений.
Подробная настройка стилей отображения и возможность использования кастомного CSS.
Прогресс-бар может быть включен или отключен отдельно от времени чтения и является полностью настраиваемым: от цвета до места размещения, доступно несколько предустановленных стилей.
Плагин удобен, но для его использования потребуется знание английского языка, так как он не переведен на русский.
Read Meter – Reading Time & Progress Bar
Еще одно бесплатное дополнение для WordPress — Read Meter. Этот удобный и быстрый плагин обеспечивает как отображение времени на чтение, так и прогресс-бар.
У Read Meter простые настройки, что является как плюсом, так и минусом. В опциях нужно всего лишь указать скорость чтения и выбрать типы постов для отображения информации, а также настроить типографику.
Удобной особенностью является возможность вывести информацию о времени чтения не только в стандартных местах, но и в любом другом месте текста, используя шорткод или блок Gutenberg.
Что касается прогресс-бара, то он может быть оформлен всего в 2 вариантах и размещаться либо вверху, либо внизу страницы. Настройка заключается в выборе положения, толщины линии и цветов.
Reading Time WP
При помощи Reading Time WP можно вывести примерное время чтения материала. Этот русскоязычный плагин упрощает настройку и исключает необходимость перевода.
Все настройки стандартные. Интересная особенность этого плагина — работа шорткода с различными параметрами, включая атрибут post_id. Это очень удобно, если необходимо указать время чтения для другой страницы в определенных ситуациях, таких как создание виджета.
О плагине Reading Time WP в основном встречаются положительные отзывы от веб-мастеров. Авторы периодически обновляют его, чтобы обеспечить совместимость с последними версиями WordPress и PHP, но новых функций в обновлениях не добавляют.
Worth The Read
Расширение Worth The Read предлагает функции для отображения времени на чтение, а также позволяет добавить индикатор прогресса. Этот плагин обладает широкими настройками.
С данным плагином удобно использовать систему исключений. В настройках можно указать идентификаторы страниц и постов, для которых требуется выводить минуты на чтение, а для каких — нет.
Кроме того, особенность этого плагина заключается в двух методах подсчета времени:
- С учетом пробелов — подходит как для латиницы, так и для кириллицы.
- Без учета пробелов — удобно для языков, где пробелы между словами используются менее интенсивно.
Этот модуль отлично справляется с задачей, позволяя легко добавить на WordPress время на чтение. Например, возможно учитывать среднее количество изображений на минуту для определения общего времени просмотра страницы.
Worth The Read не переведен на русский язык, поэтому потребуются знания английского для работы с ним.
Arabic & English Estimated Reading Time
Простое расширение Arabic & English Estimated Reading Time практически не требует настройки. Оно удобно в ситуациях, когда необходимо показать различное время на чтение для русскоязычной и англоязычной версий сайта.
Данный модуль поддерживает работу сразу с двумя языками и позволяет указать разное количество слов, требуемых для чтения на каждом из них.
Модуль абсолютно бесплатен и не включает дополнительных платных опций.
Как в Вордпресс добавить время чтения с помощью кода
Плагины удобны для начинающих, не обладающих навыками программирования, и желающих быстро внедрить нужный функционал на сайте. Однако опытные разработчики часто предпочитают реализовывать подобные задачи, такие как отображение времени на чтение, с помощью кода.
Преимущества такого подхода перед плагинами:
Полный контроль над кодом сокращает риски «сломать» сайт или создать уязвимость, связанную с установленными плагинами.
Даже самый простой модуль увеличивает нагрузку на WordPress, чего не скажешь о нескольких строчках кода, добавленных вручную.
Приятно настраивать стили с нуля.
В заключение, приведу простой пример кода для добавления времени на чтение в WordPress. Я использую его на своих сайтах, и он работает достаточно эффективно. Просто внедрите его в файл functions.php вашего ресурса, и информация о времени чтения появится автоматически во всех постах, между заголовком и содержанием. Без использования плагинов.
function getWordCount($content) { return str_word_count(strip_tags($content)); } function calculateReadingTime($content, $readingSpeed = 120) { $wordCount = getWordCount($content); return ceil($wordCount / $readingSpeed); } function displayReadingTime($content) { if (is_single()) { $readingTime = calculateReadingTime($content); return sprintf('Время на прочтение: %d мин.
', $readingTime) . $content; } return $content; } add_filter('the_content', 'displayReadingTime');Краткие пояснения к коду:
- Функция getWordCount используется для определения количества слов в тексте. HTML-теги и знаки препинания не учитываются, считываются только целые слова.
- Функция calculateReadingTime предназначена для вычисления приблизительного времени, необходимого для чтения текста. Значение переменной $readingSpeed указывает количество слов, которые человек может прочитать за минуту. Рекомендую устанавливать значение в диапазоне от 120 до 180, в зависимости от типа контента. Чтобы итоговое значение всегда было целым, мы используем округление в большую сторону с помощью функции ceil.
- Функция displayReadingTime отвечает за добавление информации о времени чтения текста. В приведенном примере вывод таймера происходит только в отдельных записях с использованием условной функции is_single. Это условие можно адаптировать, если необходимо выводить данные на страницах, в архиве или других типах контента.
- Когда пользователь открывает статью, код удаляет все HTML-теги из текста и подсчитывает количество слов.
- Затем по простой формуле «количество слов / скорость чтения» вычисляется время, которое округляется до целого числа.
- Полученное значение показывается перед текстом со соответствующим пояснением.
Процесс работы выглядит следующим образом:
В представленном коде используется класс reading-time для блока, отображающего время на чтение. Вы можете применить его для стилизации, изменив соответствующий css-файл вашей темы. Например, на одном из сайтов я применяю такие стили, которые могут послужить основой для вашего проекта:
.reading-time
Таким образом, получается стильный блок, который акцентирует внимание на времени, необходимом для прочтения, пример которого вы можете увидеть ниже.
Шаблоны со встроенной опцией вывода времени чтения
Существуют шаблоны WordPress, которые уже имеют встроенные настройки для отображения информации о времени чтения. Ярким примером является популярная российская тема Reboot от WPShop.
Это универсальная тема, подходящая для личных портфолио, блогов и корпоративных сайтов. Она хорошо кастомизируется и изначально включает опцию для отображения времени чтения.
В кастомизаторе темы Reboot можно выбрать опцию «Время чтения» в настройках блока «Запись».
После внесения изменений мета-информация о времени чтения будет отображаться вверху статьи. Число будет показано в аккуратном блоке рядом с другими данными, рядом с иконкой часов.
Использовать эту функцию в шаблоне Reboot можно только в записях; на страницах сделать это не удастся с помощью стандартных настроек темы. Однако в большинстве случаев это не является проблемой.
На мой взгляд, лучше всего развертывать сайт на WordPress сразу на шаблоне, который включает множество полезных встроенных функций. Тема Reboot как раз таковой является. При использовании этой темы нет нужды устанавливать дополнительные модули для отображения времени чтения или модифицировать код.
В тему также интегрированы другие полезные элементы, такие как оглавление, форма обратной связи, кнопки для социальных сетей, XML-карта сайта и многое другое.
Скидка на Reboot
Если вам необходимо включить отображение времени чтения в другом шаблоне WordPress, где такая функция не предусмотрена, вы можете воспользоваться методом с добавлением кода, описанным в этой статье. Плагины для подобной задачи подходят только в редких случаях, когда нужны уникальные опции.