はじめに (対象読者・この記事でわかること)
この記事は、PHPを用いたWordPressサイトの開発者や、WordPressのテーマカスタマイズを行っている方を対象としています。特に、カテゴリーやタグ、カスタム投稿タイプなどのアーカイブページにおいて、記事のタイトルやアーカイブページのタイトル表示が意図せず短く切り詰められてしまう問題に直面している方におすすめです。
この記事を読むことで、WordPressの強力なフック機能(特にフィルターフック)を効果的に利用し、アーカイブページのタイトル表示に関する文字数制限を解除したり、独自のルールで調整したりできるようになります。結果として、サイトのユーザビリティ向上や、SEOに配慮した柔軟なタイトル表示を実現するための実践的なスキルが身につくでしょう。
前提知識
この記事を読み進める上で、以下の知識があるとスムーズです。
- PHPの基本的な構文と関数(文字列操作、条件分岐など)
- WordPressのテーマファイル構造(functions.php など)
- WordPressのフック(アクションフック、フィルターフック)の基本的な概念と利用方法
PHP/WordPress: アーカイブページのタイトル文字数制限問題の概要
WordPressでウェブサイトを構築していると、カテゴリ一覧やタグ一覧、あるいはカスタム投稿タイプのアーカイブページなどで表示されるタイトルの文字数が、意図せず途中で途切れてしまうという経験はないでしょうか?これは多くの場合、使用しているWordPressテーマや一部のプラグインが、レイアウト崩れを防ぐ目的でタイトルに文字数制限を設けているために発生します。
特に、カテゴリー名やタグ名が長い場合、またはカスタム投稿タイプのアーカイブタイトルが詳細な説明を含む場合に、この文字数制限が問題となります。デフォルトのWordPressはアーカイブタイトルに対して文字数制限を設けていませんが、テーマのCSSやJavaScript、またはPHPコード内で特定の処理が加わることで、表示上の制約が発生することがあります。この問題は、サイトの訪問者にとって情報が不十分に見えたり、SEOの観点からも望ましくない影響を与えたりする可能性があります。
例えば、テーマがアーカイブページのタイトルを生成する際に、mb_substr() などを用いて特定の文字数(例:20文字)で強制的に切り詰めているケースや、JavaScriptでDOM要素のテキストコンテンツを操作して短縮表示しているケースなどが考えられます。この問題を解決するには、WordPressの標準機能やテーマのカスタマイズポイントを理解し、適切な方法で介入する必要があります。
アーカイブタイトル文字数制限の具体的な解決策
アーカイブページのタイトル文字数制限を解決するための具体的な手順とコード例を解説します。ここでは、WordPressのフィルターフックを主に利用する方法と、テーマファイルを直接編集する代替案(ただし非推奨)について説明します。
ステップ1: 問題の特定と現在の挙動の確認
まず、どの部分でタイトルが切り詰められているのか、その原因を特定することが重要です。
- ブラウザの開発者ツールで確認:
アーカイブページを開き、ブラウザの開発者ツール(F12キーで開くことが多い)を使用して、切り詰められているタイトル要素を検査します。
- HTML内でテキストが途中で途切れているか?
- CSSで
text-overflow: ellipsis;などが適用されているか? - JavaScriptで動的にテキストが操作されていないか?
- テーマファイルの確認:
使用しているテーマの
archive.php、category.php、tag.php、taxonomy.php、index.phpなどのテンプレートファイルを調べます。これらのファイル内で、アーカイブタイトルを出力している部分(通常はthe_archive_title()やget_the_archive_title()が使われています)を探し、その周辺に文字数制限を設けるようなPHP関数(例:mb_substr())や独自の関数が使われていないか確認します。 - WordPressの標準挙動の理解:
WordPressのコア関数である
the_archive_title()は、デフォルトではタイトルを切り詰めません。この関数は内部的にget_the_archive_title()を呼び出し、その結果を出力します。したがって、問題は通常、テーマまたはプラグインがget_the_archive_titleフィルターフックを介してタイトルを改変しているか、直接テンプレートファイルで文字数制限を適用しているかのいずれかです。
ステップ2: WordPressのフィルターフックを用いた解決策
最も推奨される解決策は、WordPressのフィルターフックを利用することです。これにより、テーマファイルを直接編集するリスクを避け、テーマのアップデートにも強く、保守性の高い方法でカスタマイズが可能です。
get_the_archive_title フィルターフックの利用
get_the_archive_title フィルターフックは、the_archive_title() 関数がタイトルを出力する直前、つまり生タイトル文字列を取得した後に適用されます。このフックを使うことで、取得したタイトル文字列に対して、独自の処理(制限の解除、文字数調整など)を追加できます。このコードは、テーマの functions.php ファイル、または独自のプラグインファイルに追加します。
Php/** * アーカイブページのタイトル文字数制限を調整する * * @param string $title オリジナルのアーカイブタイトル * @return string 調整後のアーカイブタイトル */ function custom_archive_title_length($title) { // 現在のページがアーカイブページであるか確認 if (is_archive()) { // 例1: 特定のアーカイブタイプ(カテゴリ、タグ)での制限を解除する場合 if (is_category() || is_tag() || is_tax()) { // カテゴリ、タグ、カスタムタクソノミーの場合 // テーマや他のプラグインによって適用されているかもしれない文字数制限を上書きして、元のタイトルをそのまま返す // このフィルターはHTMLタグを含む文字列を受け取る可能性があるため、strip_tagsで除去してから処理することも検討 return strip_tags($title); } // 例2: 特定のアーカイブタイプ(カスタム投稿タイプ)で、任意の文字数に切り詰める場合 if (is_post_type_archive('your_custom_post_type')) { // 'your_custom_post_type' を実際のカスタム投稿タイプ名に置き換える $clean_title = strip_tags($title); // HTMLタグを除去 $max_length = 30; // 30文字に制限 if (mb_strlen($clean_title, 'UTF-8') > $max_length) { return mb_substr($clean_title, 0, $max_length, 'UTF-8') . '...'; } return $clean_title; } // 例3: すべてのアーカイブページで文字数制限を解除する場合(非推奨: 長すぎるタイトルはデザインを崩す可能性あり) // return strip_tags($title); } // アーカイブページでない場合や、上記条件に合致しない場合は元のタイトルをそのまま返す return $title; } add_filter('get_the_archive_title', 'custom_archive_title_length', 10); // 優先度10(デフォルト)で適用
解説:
is_archive(): 現在のページが何らかのアーカイブページであるかを判定します。is_category()/is_tag()/is_tax(): 特定の種類のアーカイブページであるかを判定する条件分岐です。これらを活用することで、必要なアーカイブページにのみ処理を適用できます。is_post_type_archive('your_custom_post_type'): 特定のカスタム投稿タイプのアーカイブページであるかを判定します。strip_tags($title): タイトル文字列に含まれるHTMLタグを除去します。the_archive_title()のデフォルト出力には<span class="screen-reader-text">などが含まれることがあるため、正確な文字数処理のために除去するのが一般的です。mb_strlen()/mb_substr(): マルチバイト文字(日本語など)を正しく扱うためのPHP関数です。strlen()やsubstr()を使うと文字化けや文字数カウントの誤りが発生するため、必ずmb_プレフィックスの付いた関数と'UTF-8'エンコーディング指定を使用しましょう。add_filter()の第三引数は優先度です。デフォルトは10ですが、他のテーマやプラグインがより高い優先度で同じフィルターを適用している場合、この数値を調整して目的の処理が実行されるようにすることができます(例:99など大きな数に設定すると、他のほとんどのフィルターより後に実行されます)。
document_title_parts フィルターフックの利用(<title> タグに影響する場合)
もし問題が、ブラウザのタブに表示されるサイト全体の <title> タグ内でアーカイブタイトルが切り詰められている場合、document_title_parts フィルターフックが役立つことがあります。
Php/** * HTMLの<title>タグ内のアーカイブタイトル部分を調整する * * @param array $title_parts タイトルを構成する要素の配列 * @return array 調整後のタイトル要素の配列 */ function custom_document_title_parts_length($title_parts) { if (is_archive()) { if (isset($title_parts['title'])) { $current_title = $title_parts['title']; // 例: アーカイブページのタイトルを30文字に制限 $max_length = 30; if (mb_strlen($current_title, 'UTF-8') > $max_length) { $title_parts['title'] = mb_substr($current_title, 0, $max_length, 'UTF-8') . '...'; } // 例: アーカイブページのタイトル制限を解除する場合(何もしない) // $title_parts['title'] = $current_title; } } return $title_parts; } add_filter('document_title_parts', 'custom_document_title_parts_length');
解説:
- このフィルターは、WordPress 4.4 以降で導入されたタイトルタグの自動生成機能(
add_theme_support('title-tag'))に影響を与えます。 $title_parts配列には、title(投稿/ページのタイトル)、tagline(サイトのキャッチフレーズ)、site(サイト名)などのキーが含まれます。$title_parts['title']を直接操作することで、HTMLの<title>タグ内のアーカイブタイトル部分を調整できます。
ステップ3: テーマファイルを直接編集する代替案 (非推奨)
上記フィルターフックでの解決が難しい、または特定のテーマの挙動が複雑すぎる場合に限り、テーマファイルを直接編集する方法も考えられます。しかし、この方法はテーマのアップデート時に変更が上書きされるリスクがあるため、子テーマを使用しない限り非推奨です。
- 該当テンプレートファイルの特定:
archive.php、category.php、tag.php、taxonomy.php、またはcontent-archive.phpなど、実際にアーカイブタイトルを出力しているPHPファイルを特定します。 -
出力箇所の変更:
the_archive_title()が記述されている箇所を見つけ、その出力方法を変更します。```php // 例: archive.php や category.php 内 if ( have_posts() ) : ?>
<?php // the_archive_title(' ', '
'); // 元のコード// 修正版: get_the_archive_title() でタイトルを取得し、手動で加工・出力 $archive_title = get_the_archive_title(); $clean_archive_title = strip_tags($archive_title); // HTMLタグを除去 $max_length = 20; // 任意の文字数 if (mb_strlen($clean_archive_title, 'UTF-8') > $max_length) { $trimmed_title = mb_substr($clean_archive_title, 0, $max_length, 'UTF-8') . '...'; } else { $trimmed_title = $clean_archive_title; } echo '<h1 class="page-title">' . esc_html($trimmed_title) . '</h1>'; ?> </header><!-- .page-header --> <?php /* Start the Loop */ while ( have_posts() ) : the_post(); // ... 投稿コンテンツの表示 ... endwhile;endif;
`` **解説:** -get_the_archive_title()でタイトル文字列を取得し、それを変数に格納します。 -strip_tags()でHTMLタグを除去し、mb_strlen()で文字数をチェック。 - 必要に応じてmb_substr()で切り詰め、esc_html()` でエスケープして出力します。
ハマった点やエラー解決
- マルチバイト文字の扱い:
substr()やstrlen()を使用すると、日本語のようなマルチバイト文字が正しく処理されず、文字化けや意図しない文字数での切り詰めが発生します。必ずmb_substr()とmb_strlen()を使用し、エンコーディングとして'UTF-8'を指定しましょう。 - フィルターの適用順序:
複数のフィルターが同じデータに影響を与える場合、
add_filter()の第3引数(優先度)が重要になります。テーマやプラグインのフィルターを上書きしたい場合は、より大きな数値を設定して優先度を高くします。 - HTMLタグの除去忘れ:
the_archive_title()は、<span>タグなどのHTMLを含むことがあります。文字数計算の前にstrip_tags()でこれらを除去しないと、タグが文字数にカウントされてしまい、予期しない結果になることがあります。 - 意図しないページへの影響:
is_archive()だけで条件分岐すると、すべてのアーカイブページ(日付、著者など)に影響が出ます。is_category()やis_tag()、is_post_type_archive()など、より具体的な条件分岐を使って、必要なページにのみ適用するよう慎重に実装しましょう。
解決策
- 常にPHPのマルチバイト文字列関数(
mb_substr,mb_strlen)を使用し、エンコーディングを明示的に指定すること。 - WordPressのフィルターフックを使いこなすことで、テーマのコードを直接編集するリスクを最小限に抑えること。必要に応じて
remove_filter()を使って、特定のテーマやプラグインのデフォルトのフィルターを無効化することも検討する。 - 条件分岐を細かく設定し、カスタマイズがサイト全体に予期せぬ影響を与えないようにすること。
- カスタマイズは必ず子テーマの
functions.phpに記述するか、専用のカスタムプラグインを作成して管理すること。
まとめ
本記事では、PHP(WordPress)のアーカイブページにおいて、記事タイトルの文字数が意図せず制限されてしまう問題と、その具体的な解決策について解説しました。
get_the_archive_titleフィルターフック が最も推奨される解決策であり、テーマファイルを直接編集せずに柔軟なカスタマイズを可能にします。- マルチバイト文字に対応する
mb_substrとmb_strlenの使用は必須であり、エンコーディングに'UTF-8'を指定することで文字化けを防ぎます。 is_category()やis_tag()などの条件分岐 を適切に利用することで、必要なアーカイブページにのみカスタマイズを適用し、予期せぬ影響を避けることができます。
この記事を通して、WordPressのアーカイブページのタイトル表示を自由にコントロールし、サイトのデザインやコンテンツに合わせた最適な表現を実現できるようになるでしょう。これは、ユーザーエクスペリエンスの向上だけでなく、検索エンジン最適化(SEO)の観点からも非常に重要です。
今後は、カスタム投稿タイプやカスタムタクソノミーにおける同様の文字数制限課題、またはより複雑なタイトル表示ロジックの実装方法についても、ぜひ挑戦してみてください。
参考資料
- WordPress Codex:
the_archive_title() - WordPress Codex:
get_the_archive_titlefilter hook - WordPress Codex:
document_title_partsfilter hook - PHP Manual:
mb_substr() - PHP Manual:
strip_tags()
