もう悩まないで!WordPressでタイトルの文字数を制限して取得する方法
  • もう悩まないで!WordPressでタイトルの文字数を制限して取得する方法
  • 記事公開:2017/12/11
  • 最終更新:-------------

もう悩まないで!WordPressでタイトルの文字数を制限して取得する方法

WordPressでタイトルの文字数を制限して取得する方法 TOPページに新着情報を表示させる時など、記事のタ ...

この記事は約 5 分で読めます。

WordPressでタイトルの文字数を制限して取得する方法

TOPページに新着情報を表示させる時など、記事のタイトルを取得したい場面に多々出会います。

しかも、タイトルの文字数を制限して取得したい!
そんな場面が意外と多いです。

そこで今回は、タイトルの文字数を制限して取得する方法をまとめてみました。
タイトルの文字数を制限して取得したい方は参考にしてください。

それでは、見ていきましょう。

まず、単純に文字数を制限してタイトルを取得するコードをご紹介します。
それが以下のコードです。

<?php echo mb_substr($post->post_title, 0, 20); ?>

タイトルを頭から20文字だけ取得するコードです。

取得する文字数は、上記の「20」の値を変更することで任意の文字数に変えられます。
30文字取得したい場合は「30」としてやればOKです。

しかし、タイトルの文字数を制限すると、タイトルによっては単語の途中で切れてしまう可能性がでてきます。

「もう悩まないで!Wordpressでタイトルの文」

仮に文字数を制限して取得したタイトルが上記だったらどうでしょうか?
変な位置でタイトルが切れていてちょっとおかしいですよね。

タイトルに続きがあるのかないのかが分からない状態です。
不具合が生じているようにも見えます。

そこで考えられるのが、文字数を制限して取得したタイトルの最後に「…」を表示させ、続きがあることを表現する方法です。

以下のコードで、文字数を制限したタイトルの最後に「…」を表示させることができます。

<?php echo mb_substr($post->post_title, 0, 20).'...'; ?>

この形式であれば、タイトルに続きがあるんだよ~と伝えることができます。

末尾の文字列は自由に変更できます。
上記コードの「…」を任意の文字列に変更してください。

ただこのコードですと、制限した文字数以内のタイトルでも末尾に「…」がついてしまいます。

「WordPressの徹底解剖…」

タイトルに続きはないのに、まるで続きがあるように見えます。
ちょっと違和感がありますよね。

最終的に選ぶべきコードは、制限した文字数以上のタイトルなら「…」を表示させ、制限した文字数以内なら「…」を表示しないコードです。そのコードが以下のコードです。

<?php
if(mb_strlen($post->post_title, 'UTF-8')>20){
$title= mb_substr($post->post_title, 0, 20, 'UTF-8');
echo $title.'……';
}else{
echo $post->post_title;
}
?>

タイトルを頭から20文字だけ取得して、タイトルが20文字以上の場合、末尾に「…」を表示させ、タイトルが20文字以内であれば、末尾に「…」を表示しないコードです。

取得する文字数は「20」の値を変更することで任意の文字数に変えられます。
このコードのみ「20」の値が2つあるので、両方変更する必要がありますので注意してください。
30文字にするなら両方の値を「30」に変更しましょう。

まとめ

WordPressでタイトルの文字数を制限して取得する方法をご紹介しました。

TOPページの記事一覧やLOOPなどで、見た目を整えるためにタイトルの文字数を制限したい場面などに役立つコンテンツです。タイトルの文字数を制限したい方は、ぜひ参考にしてください。

この記事が気に入ったら【いいね】しよう!

Wordpressサイトのカスタマイズで
お困りではありませんか?

あなたのWordpressサイトを、ご希望に沿ってカスタマイズいたします。
次に該当する方は、お気軽にご相談下さい。

  • Wordpressサイトをカスタマイズしたいが、やり方が分からないで困っている。カスタマイズの知識が豊富な人に任せたい。
  • Wordpressサイトをカスタマイズしたいが、自分でカスタマイズする暇がない。カスタマイズが得意な人に丸投げしたい。
  • Wordpressサイトをカスタマイズしてみたが、上手くカスタマイズできなかった。カスタマイズ経験が豊富な人に任せたい。
  • Wordpressサイトをカスタマイズしてみたら、バグが発生して困っている。正常に動作するように正しくカスタマイズしてほしい。

一つでも該当する方は、以下のリンクからチェックしてみてください。

詳細を確認する

現在、上記サービスは別ドメインで運用しております。
ドメインは異なりますが、わたしが提供させていただいているサービスです。

著者:takaya kondo

岡山在住のWebディレクターです。Wordpressを使ったWEBサイト制作を中心に10年間ほど活動させていただいています。

Wordpress関連の記事でお役に立てれば幸いです。

【関連記事】あなたが興味のありそうな関連記事をご紹介します。

  • 2014-11-25

    WordPress初心者にオススメ!WordPressの各種操作方法を解説しているサイトをまとめてみた。

    これからWordPressを勉強する方も最初は何かと調べることが多いはず。私も参考にしていた初心者向けのWordPress解説サイトをご紹介します。 記事を読む

  • 2018-09-16

    Jetpackの「パブリサイズ共有」をカスタム投稿でも使えるようにする方法

    Jetpackの「パブリサイズ共有」をカスタム投稿でも使えるようにする方法をご紹介していきます。ご紹介しているコードをコピペと編集するだけで、「パブリサイズ共有」をカスタム投稿で使えるようになります。 記事を読む

  • 2015-01-12

    不要なデフォルトのウィジェットを非表示にしてスッキリさせる方法

    WordPressのデフォルトウィジェットで不要なウィジェットを非表示にするカスタマイズ方法をご紹介します。ウィジェットは便利な機能ですが、デフォルトの中には利用しないものも含まれています。使わないウィジェットは非表示にして管理画面をスッキリとさせましょう。 記事を読む

  • 2015-03-24

    WordPressの最大行表示エディターを利用している方に便利な小技

    WordPressの最大行表示エディターを利用している方に便利な小技をご紹介します。最大行表示エディターを使っていると、ページのTOPに戻るのが面倒ですよね。そんな時に便利な小技です。意外と知られていない小技かも・・・。 記事を読む

  • 2015-09-18

    簡単だった!WordPressサイトの画像に自動的に付与されるclass等のタグを削除してみた。

    WordPressサイトの投稿に記事を挿入すると、自動的にclassやtitleなどのタグが付与されます。場合によってはこのタグは邪魔になる事ってありませんか?これらのタグを付与させないカスタマイズのご紹介です。コピペだけで実装可能です! 記事を読む

コメントを残す


(必須)