【0から学ぶWordPress】文字数制限をしてタイトルや本文の表示をさせる

お世話になっております
大阪でホームページ制作を行っております。株式会社ディー・オー・エス
「ドスブイサポート」でございます。

さて、今回は記事一覧ページでよくみかける・・・続きを読むみたいな
文字数を制限して一覧に出力させたい事があると思いますが、そちらを解説していきたいと思います。

記事一覧で文字数を制限させる

タイトルの下に青くなっている部分が今回表示させたい箇所ですが
wordpressには「the_contents」で記事の表示は可能ではありますが、これだと全文が表示されてしまいますので、一覧ではないですよね！
ではどのようにして表示するのか説明させて頂きます

指定した文字数のテキストを抜き出す「mb_substr」関数

PHPの関数を使います。
mb_substr — 文字列の一部を得る

WordPressで文字数制限したテキストを表示する方法

タイトルの文字数を制限して表示する方法

まずはタイトルの制限から記載させて頂きます。

タイトルは長い時もあれば短い時もあると思いますので、その条件分岐も併せて記載してあげると綺麗になります。

<?php
if(mb_strlen($post->post_title, 'UTF-8')>25){
	$title= mb_substr($post->post_title, 0, 25, 'UTF-8');
	echo $title.'続きを読む';
}else{
	echo $post->post_title;
}
?>

この例の場合、25文字以降は「続きを読む」となります。
25文字以内の場合はそのまま表示といった条件分岐ですね！

記事本文の文字数を制限して表示する方法

本文は、上記にも説明しましたが、「the_content()」で本来は表示します。
しかし、本文にはHTMLタグなどが含まれる場合、それも文字数となるので、表示が崩れてしまいます。

防ぐために「strip_tags」関数を加えます

<?php
if(mb_strlen(get_the_excerpt(), 'UTF-8')>50){
	$excerpt= mb_substr(get_the_excerpt(), 0, 50);
	echo $excerpt.'...';
}else{
	echo get_the_excerpt();
}
?>

こちらもタイトルと同じく条件分岐しております。

まとめ

今回は、記事一覧に文字数を制限して表示させる内容を解説させて頂きました
これで記事一覧の見出しとしてはバッチリなレイアウトになると思います

以上

最後までご覧いただきまして有難うございました！
現時点ではコロナ渦で大変ですが、皆様のご健康を心より祈念しております！

お仕事のご依頼やお問い合わせはフォームやツイッターにてお気軽にお問い合わせ下さい。

お問い合わせフォーム

» 高橋しゃちょー (@osaka_dos) | Twitter