8 лучших плагинов WordPress для индикатора прогресса чтения (большинство из них бесплатны)

Опубликовано: 2022-08-02

Хотите добавить индикатор выполнения чтения в WordPress?

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

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

В этом посте мы собрали 8 лучших вариантов, 6 из которых совершенно бесплатны.

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


Что такое полоса прогресса чтения?

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

Обычно вы прикрепляете горизонтальную полосу вверху или внизу страницы. По мере того как пользователи прокручивают сообщение, полоса «заполняется», показывая, насколько они близки к концу контента.

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

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

HubSpot добавляет оранжевый индикатор выполнения, который появляется прямо под липким заголовком:

Индикатор выполнения чтения HubSpot
Пример индикатора выполнения чтения от HubSpot.

Thrive Themes имеет зеленый индикатор выполнения чтения, который также отображается под липким заголовком:

Пример индикатора выполнения чтения из Thrive Themes.
Пример индикатора выполнения чтения из Thrive Themes.

Однако вы можете поэкспериментировать с различными вариантами размещения индикатора выполнения в зависимости от вашего сайта.

Простой способ мгновенно улучшить UX вашего сайта? Добавлен индикатор выполнения чтения! Начните здесь ️ Нажмите, чтобы твитнуть

Зачем добавлять индикатор выполнения чтения в WordPress?

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

Во-первых, давайте поговорим о пользовательском опыте в целом.

Большинство людей хотят знать, во что они ввязываются, прежде чем инвестировать время в ваш пост. Это 5-минутная статья, которую они могут прочитать между задачами, или это длинная 20-минутная статья, которая потребует серьезной концентрации?

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

Как только ваши посетители начнут читать, индикатор выполнения также может побудить их закончить сообщение. Например, если читатель увидит, что он уже прочитал 80% контента, ему будет предложено закончить последние 20%, потому что он уже прочитал большую часть поста.

Эти улучшения пользовательского опыта могут оказать положительное влияние на два ключевых показателя:

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

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

8 лучших плагинов WordPress для индикатора прогресса чтения

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

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

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

Лучше всего то, что все эти плагины должны работать практически с любой темой WordPress.

Прочитать метр

Плагин Read Meter.
Прочитать метр

Read Meter — это плагин индикатора выполнения чтения от Brainstorm Force, той же команды, что и популярная тема Astra WordPress (которая вошла в наш список самых быстрых тем WordPress).

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

Вот все, что вы получите с Read Meter:

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

Цена : Read Meter абсолютно бесплатен.

Прогресс чтения

Плагин индикатора чтения.
Прогресс чтения

Наряду с Read Meter, Reading progressbar — еще один из самых популярных плагинов индикатора выполнения на WordPress.org. Однако, в отличие от Read Meter, этот плагин не дает вам возможности добавить расчетное время чтения — он предназначен исключительно для индикатора выполнения.

Тем не менее, это дает вам некоторую дополнительную гибкость таргетинга, которую не предлагает Read Meter. Например, вы можете нацелить свой индикатор выполнения на определенные шаблоны в дополнение к таргетингу на тип публикации.

Вот все, что вы получите с полосой прогресса чтения:

  • Гибкое позиционирование — вы можете автоматически прикрепить индикатор выполнения вверху или внизу страницы. Или есть также настраиваемый вариант позиционирования, который позволяет вам прикрепить его к любому элементу CSS. Например, если у вас есть липкий заголовок, вы можете прикрепить его под меню навигации заголовка, а не полностью вверху страницы (как в примере с HubSpot выше).
  • Настраиваемый дизайн — меняйте высоту и цвета индикатора выполнения в соответствии с вашим сайтом.
  • Параметры таргетинга — вы можете отображать индикатор выполнения только для определенных шаблонов и/или типов сообщений.

Цена : индикатор прогресса чтения на 100 % бесплатный.

Стоит прочитать

Плагин «Стоит прочитать».
Стоит прочитать

Worth the Read — это один из самых настраиваемых плагинов WordPress для индикатора выполнения, что делает его отличным вариантом, если вы считаете, что предыдущие плагины слишком ограничены.

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

Вот все, что вы получите с Worth the Read:

  • Варианты горизонтального или вертикального позиционирования — включают горизонтальный индикатор выполнения в верхней или нижней части экрана ИЛИ вертикальный индикатор выполнения в левой или правой части экрана. Вертикальный вариант уникален, так как большинство других плагинов его не поддерживают.
  • Таргетинг по типам сообщений — включайте индикатор выполнения чтения только для определенных типов сообщений.
  • Таргетинг на устройства — у вас есть возможность отключить индикатор выполнения для мобильных устройств и планшетов (или настольных компьютеров).
  • Ход комментариев — у вас есть возможность включать комментарии в ход чтения, что может быть полезно, если у вас есть активные разделы комментариев с полезной информацией.
  • Поддержка RTL — это один из немногих плагинов, который позволяет вам переходить на RTL, что может быть полезно для сайтов на языках RTL.
  • Параметры стиля — настраивайте цвета, толщину, непрозрачность и т. д. Если вы включили комментарии, вы даже можете использовать отдельный цвет, чтобы указать, когда начинается раздел комментариев на индикаторе выполнения.
  • Расчетное время чтения — если вы включите время чтения, вы можете настроить его функциональность и разместить его автоматически или вручную с помощью шорткода.

Цена : Стоит прочитать на 100% бесплатно.

Поймать полосу выполнения прокрутки

Область настроек плагина Catch Scroll Progress Bar.
Поймать полосу выполнения прокрутки

Catch Scroll Progress Bar — еще один облегченный вариант добавления базового индикатора выполнения на ваш сайт.

Это делает вещи довольно простыми, с минимальными параметрами, которые вам нужны для размещения и оформления индикатора выполнения.

Вот все, что вы получите с индикатором выполнения Catch Scroll:

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

Цена : Полоса прогресса Catch Scroll на 100 % бесплатна.

Прогресс чтения WP

Плагин WP Reading Progress.
Прогресс чтения WP

WP Reading Progress — еще один бесплатный плагин WordPress для индикатора выполнения, доступный на WordPress.org.

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

Вот все, что вы получите с WP Reading Progress:

Боретесь с простоями и проблемами WordPress? Kinsta — это решение для хостинга, предназначенное для экономии вашего времени! Ознакомьтесь с нашими возможностями
  • Гибкое позиционирование — автоматически прикрепляйте панель вверху или внизу страницы. Или вы можете вручную прикрепить его к любому селектору CSS.
  • Таргетинг по типам сообщений — включайте индикатор выполнения только для определенных типов сообщений. Также есть возможность включить/отключить на страницах архива.
  • Настройка стиля — вы можете настроить цвет и толщину индикатора выполнения. Однако вы можете выбрать только один цвет, и нет никаких параметров непрозрачности.

Цена : WP Reading Progress на 100% бесплатен.

Время чтения

Премиальный плагин Reading Time.

Reading Time — первый плагин прогресса чтения в этом списке, который поставляется только в премиум-версии.

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

Есть 2 основные причины, по которым вы можете предпочесть Reading Time бесплатным альтернативам:

  • 8+ предустановленных стилей — вы получаете несколько уникальных вариантов стиля, например, использование вертикальных полос вместо сплошной заливки внутри индикатора выполнения (на фото выше).
  • Расширенные правила таргетинга — помимо таргетинга на типы сообщений и шаблоны, вы можете настроить таргетинг на свои индикаторы выполнения по очень конкретным правилам, таким как роли пользователей, URL-адреса, устройства и многое другое.

Вы также получаете все «стандартные» функции, которые вы ожидаете от плагина:

  • Гибкое позиционирование — в дополнение к автоматическому расположению сверху или снизу вы также можете использовать пользовательское позиционирование, чтобы прикрепить индикатор выполнения к любому селектору CSS.
  • Параметры стиля — помимо 8+ предустановленных стилей, вы также получаете общие параметры для настройки цветов и высоты индикатора выполнения.

Цена : «Время чтения» стоит 15 долларов США, включая пожизненные обновления для одного сайта и 6 месяцев поддержки.

Индикатор положения чтения

Плагин индикатора позиции чтения.
Индикатор положения чтения

Reading Position Indicator — еще один легковесный бесплатный плагин индикатора выполнения на WordPress.org.

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

Вот все, что вы получите с индикатором положения чтения:

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

Цена : индикатор положения чтения на 100 % бесплатен.

РеБар

Премиальный плагин ReBar.
РеБар

ReBar — еще один премиальный плагин WordPress для индикатора выполнения чтения, который продается на торговой площадке Envato CodeCanyon.

Как и в случае с Reading Time, вот некоторые из уникальных функций, которые он предлагает, которые могут стоить того, чтобы потратить на него деньги:

  • 8+ предустановленных стилей — вы получаете ряд уникальных стилей, выходящих за рамки однотонных заливок, таких как пластика, градиенты, стиль iOS и другие.
  • Расширенные правила таргетинга — помимо таргетинга на типы сообщений, вы можете настроить таргетинг на свои индикаторы выполнения по очень конкретным правилам, таким как роли пользователей, URL-адреса, устройства и многое другое.
  • Поддержка бесконечной прокрутки — ReBar по-прежнему работает с макетами с бесконечной прокруткой, что делает его отличным вариантом для таких сайтов. Вы можете определить область прокрутки на основе селекторов CSS, и она будет генерировать уникальный индикатор выполнения для каждого сообщения в бесконечной прокрутке.

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

  • Горизонтальный и вертикальный стили — разместите горизонтальную полосу выполнения вверху или внизу страницы ИЛИ разместите вертикальную полосу выполнения слева или справа от страницы.
  • Настраиваемые стили — в дополнение к 8+ предустановленным стилям вы также можете настроить цвета и высоту/ширину индикатора выполнения.
  • Поддержка RTL — вы можете перевернуть индикатор выполнения для языков RTL.

Цена : ReBar стоит 15 долларов США, включая пожизненные обновления для одного сайта и 6 месяцев поддержки.

Ознакомьтесь с этими бесплатными и простыми в использовании плагинами индикатора выполнения чтения, 6 из которых совершенно бесплатны! Нажмите, чтобы твитнуть

Резюме

На этом мы завершаем нашу коллекцию 8 лучших плагинов WordPress для индикатора прогресса чтения.

Для самых простых вариантов добавления основного индикатора выполнения вы можете рассмотреть такие плагины, как Read Meter или Reading progressbar.

С другой стороны, если вам нужна максимальная настраиваемость бесплатно, вы можете начать с Worth the Read, поскольку он включает в себя ряд уникальных опций и функций, которые не предлагают другие плагины.

Если вы хотите выйти за рамки сплошного цвета заливки индикатора выполнения, вы также можете рассмотреть варианты премиум-класса в CodeCanyon — либо Reading Time, либо ReBar. Опять же, самые уникальные детали этих плагинов заключаются в том, что оба они имеют более 8 предустановленных стилей и гораздо более продвинутые параметры таргетинга.

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

У большинства из них есть бесплатные версии на WordPress.org, что упрощает их тестирование. Если вы размещаете свой сайт на Kinsta, вы можете легко создать тестовый сайт, чтобы безопасно протестировать, как каждый плагин будет выглядеть на вашем сайте.

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