WordPress: 記事を読む目安時間を表示する

WordPress: 記事を読む目安時間を表示する

2024年1月30日

[reading_time]
Wordpressのブログ記事で本文をどれくらいの時間で読めるかの目安を表示するスクリプトです。
この記事の上に表示されている部分です。
レビューブログやニュース記事などには導入も良いかもしれませんが、このサイトのようにサンプルコードを載せている場合などは、正直あまり意味ないのかなと思ったりします(笑)
下記はfunctions.phpに記述し、WordPressの管理画面の[設定]メニューにReading Timeを追加します。
デフォルトでは200単語を1分で読むとしていますが、設定画面で変更可能です。
実際に使うときは投稿画面に[[reading_time]]と入力すれば表示させたい位置に表示できます。

設定ページの追加

function reading_time_settings_page() {
    add_options_page(
        'Reading Time Settings', 
        'Reading Time', 
        'manage_options', 
        'reading-time-settings', 
        'reading_time_settings_page_html'
    );
}
add_action('admin_menu', 'reading_time_settings_page');

add_options_page 関数は、WordPressの管理画面に新しいオプションページを追加します。
第1引数: ページタイトル(ブラウザのタブに表示される)。
第2引数: メニュータイトル(管理画面のメニューに表示される)。
第3引数: このページにアクセスできる権限(ここでは manage_options)。
第4引数: メニューのスラッグ(URLの一部となる)。
第5引数: このページの内容を表示するためのコールバック関数。

設定ページのHTML

function reading_time_settings_page_html() {
    if (!current_user_can('manage_options')) {
        return;
    }
    // HTMLコンテンツ
}

この関数は、設定ページのHTMLを出力します。
current_user_can(‘manage_options’) は、現在のユーザーがこのページにアクセスする権限(オプションを管理する権限)を持っているかどうかをチェックします。
HTML部分では、フォームの開始から終了までを含めています。ここで、設定を保存するためのフォームが構築されます。

設定の登録

function reading_time_settings_init() {
    register_setting('reading-time', 'reading_speed');
    // その他の設定セクションとフィールドの追加
}
add_action('admin_init', 'reading_time_settings_init');

register_setting は、新しい設定(reading_speed)をWordPressのデータベースに登録します。第1引数は設定グループ、第2引数は設定名です。
add_settings_section と add_settings_field は、新しい設定セクションとフィールドを設定ページに追加します。

読了時間計算関数

function calculate_reading_time($post_id) {
    $post_content = get_post_field('post_content', $post_id);
    $word_count = str_word_count(strip_tags($post_content));
    $reading_speed = get_option('reading_speed', 200);
    $reading_time = ceil($word_count / $reading_speed);
    return $reading_time;
}

get_post_field(‘post_content’, $post_id) は、指定された投稿IDの内容を取得します。
strip_tags はHTMLタグを除去し、str_word_count で純粋なテキストの単語数を数えます。
get_option は、管理画面で設定された読書速度を取得します。設定されていない場合はデフォルトで「200」を使用します。
読了時間は単語数を読書速度で割ったものです。ceil 関数によって、小数点以下は切り上げられます。

ショートコードの作成

function display_reading_time_shortcode($atts) {
    global $post;
    $atts = shortcode_atts(array('id' => $post->ID), $atts);
    $reading_time = calculate_reading_time($atts['id']);
    return '<div class="reading-box"><span class="reading-time">この記事は約: ' . $reading_time . ' 分で読めます</span></div>';
}
add_shortcode('reading_time', 'display_reading_time_shortcode');

display_reading_time_shortcode はショートコードのための関数です。
shortcode_atts は、ショートコードの属性(atts)をデフォルト値とマージするために使用されます。ここでは、投稿IDをデフォルト値としています。
calculate_reading_time 関数を呼び出して、読了時間を計算します。
計算された読了時間は、指定されたフォーマットで返されます。
add_shortcode は、この関数を reading_time という名前のショートコードに関連付けます。