Время чтения статьи WordPress без плагина

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

Реализация времени на чтения статьи в WordPress

Для реализации функции подсчета времени чтения статьи вам необходимо добавить специальную функцию в файл functions.php вашей темы в WordPress. Эта функция будет осуществлять подсчет слов в статье и на основе этого определять среднее время чтения.

// Начало: Показать количество слов
function show_post_word_count() {
    ob_start();
    the_content();
    $content = ob_get_clean();
    $word_count = sizeof(explode(" ", $content));
    $output = '<span>' . 'Слов в статье: ' . '</span>' . '<span>' . $word_count . '</span>';
    return $output;
}

// Конец: Показать количество слов

// Начало: Расчетное время чтения
if (!function_exists('est_read_time')):
function est_read_time($return = false) {
    $wordcount = round(str_word_count(get_the_content()), -2);
    $minutes_fast = ceil($wordcount / 250);
    $minutes_slow = ceil($wordcount / 150);
    if ($wordcount <= 150) {
        $output = __("1 мин");
    } else {
        $output = sprintf(__("%d-%d мин"), $minutes_fast, $minutes_slow);
    }

    $output_with_word = '<span>' . 'На чтение:' . '</span>' . '<span>' . $output . '</span>';

    if ($return) {
        return $output_with_word;
    } else {
        echo $output_with_word;
    }
}
endif;
if (!function_exists('est_the_content')):
function est_the_content($orig) {
    // Подставлять время чтения к контенту
    return est_read_time(true) . "\n\n" . $orig;
}
endif;
// конец: Расчетное время чтения

Вывод функции чтения статьи

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

<div class="read_time">
   <?php echo est_read_time(); ?>
   <?php echo show_post_word_count(); ?>
</div>

Стили оформления

Для завершения нам осталось лишь придать нашей функции чтения статьи привлекательный внешний вид. Для этого откройте файл style.css и добавьте следующие стили:

.read_time {
        margin: 20px 0;
}

.read_time span {
        display: inline-block;
}

.read_time span:nth-child(1),
.read_time span:nth-child(3) {
        color: #888;
        font-size: 14px;
        margin-right: 8px;
}
.read_time span:nth-child(2),
.read_time span:nth-child(4) {
        color: #1795F5;
        font-weight: 600;
        margin-right: 10px;
}

Результат.