WordPressサイトで、詳細ページへのリンクをなくして投稿のタイトルのみ表示する投稿一覧を作る方法をご紹介します。

個別の詳細ページを作るほどではないけれど、最新情報としてお知らせを更新したいという場合に最適な設定です。

投稿本文がないときにリンクを無効にする処理を追加する

WordPressの子テーマに、投稿一覧を表示するときに本文がない投稿の詳細ページへのリンクを無効にする処理を追加します。

• WordPress子テーマの作り方

本文があるときは通常通り表示されるため、お知らせ内容によって柔軟に運用できます。

処理の一部がクラシックテーマとブロックテーマで異なるため、共通処理→それぞれのテーマ固有の処理の順番でご紹介します。

共通処理

次の処理を子テーマのfunctions.phpに追加します。

// 投稿に内容があるかをチェックする
function checkContent($post_content) {
    $no_content = false;
    if (empty(trim(strip_tags($post_content)))) {
        $no_content = true;
    }
    return $no_content;
}

// 本文がない投稿ページにnoindexを追加する
function add_noindex() {
    if (is_single()) {
        $post = get_post();
        if (checkContent($post->post_content)) {
            echo '<meta name="robots" content="noindex">' . "\n";
        }
    }
}
add_action('wp_head', 'add_noindex');

本文がない投稿のリンクを無効にしてもその詳細ページ自体は存在しており、URLがわかる人はアクセスできます。

内容がないページが多いサイトはSEOの観点であまり良くないため、そのようなページをGoogleにインデックス登録されないようnoindexを挿入します。

ブロックテーマ固有の処理

次の処理を子テーマのfunctions.phpに追加します。

// 本文が空の場合は投稿ページのリンクを消す
function block_theme_conditional_title_link( $block_content, $block ) {
    // 投稿タイトルブロック、かつ管理画面や個別ページ以外が対象
    if ($block['blockName'] === 'core/post-title' && !is_admin() && !is_singular()) {
        // 投稿を取得する
        if (isset($block['attrs']['postId']) && $block['attrs']['postId'] !== null) {
            $post_id = $block['attrs']['postId'];
        } else {
            $post_id = get_the_ID();
        }
        $post = get_post($post_id);

        // 本文が空の場合はリンクを消す
        if (checkContent($post->post_content)) {
            $block_content = '<h2 class="wp-block-post-title">' . get_the_title($post_id) . '</h2>';
        }
    }
    return $block_content;
}
add_filter( 'render_block', 'block_theme_conditional_title_link', 10, 2 );

クラシテーマ固有の処理

次の処理を子テーマのfunctions.phpに追加します。

// 本文がないarticleにクラスを追加する
function add_no_content_class($classes) {
    $post = get_post();
    if (checkContent($post->post_content)) {
        $classes[] = 'no-content';
    }
    return $classes;
}
add_filter('post_class', 'add_no_content_class');

クラシックテーマの場合はさらに子テーマのstyle.cssに下記を追加します。

/* 投稿タイトルをクリックできなくする */
.no-content .entry-title a,
.no-content .post-title a,
.no-content h2 a, 
.no-content h3 a {
    pointer-events: none !important;
    cursor: default !important;
}

/* 投稿のメタ情報はクリックできるようにしておく */
.no-content .post-meta a,
.no-content .entry-meta a {
    pointer-events: auto !important;
    cursor: pointer !important;
}

まとめ

WordPressサイトで、詳細ページへのリンクをなくして投稿のタイトルのみ表示する投稿一覧を作る方法をご紹介しました。

以上の処理を追加したWordPressサイトで、タイトルのみ入力して本文を空の状態で投稿を更新すると、投稿一覧ページで見たときにその投稿の詳細ページへのリンクが無効になります。

カナメグローバルホールディングスではWEBサイトの制作や保守業務を行っています。

WordPressサイトも対応しているのでなにかありましたらお気軽にご相談ください。