WordPressの投稿記事一覧で本文の文字数を指定して表示する

WordPressの投稿記事一覧で本文の文字数を指定して表示する

トップページやサイドバー等に最近の投稿記事一覧を表示する時に、本文の文字を指定した文字数だけ抜粋して一緒に表示する方法です。

下記のコードで下の画像のように、日付とタイトル、本文の最初の20文字を抜粋して表示する事ができます。

<?php
$postslist = get_posts('numberposts=5&orderby=post_date&order=DESC');
//$postslistにget_postsで取得したデータを入れる
foreach ($postslist as $post) : setup_postdata($post);
//ひとつずつ取り出して繰り返し出力する
?>
<dl>
	<dt>■ <?php echo get_the_date(); ?>
	//日付を表示
	| <?php the_title(); ?>
	//タイトルを表示
	</dt>
	<dd><?php 
	    echo mb_substr(get_the_excerpt(), 0, 20);
	    //PHP関数のmb_substrを使って、
	    //記事抜粋文の最初から20文字を表示
	    ?>
	    <a href="<?php the_permalink();?>">…続きを読む</a>
	    //”…続きを読む”に個別記事のリンク
	</dd>
</dl>
<?php endforeach; ?>

echo mb_substr($content, 0, 20);の()内の20で20文字と指定しているので、ここの数字を変更で取得文字数を変更できます。

訂正:echo mb_substr(get_the_excerpt(), 0, 20);の()内の20で20文字と指定しているので、ここの数字を変更で取得文字数を変更できます。

(get_the_contentで本文を取得した場合に画像も拾ってしまい表示が上手く行かないので、get_the_excerptで抜粋文を取得するコードに書き換えました。)

Related Article

10 Comments & Tracbacks

  • 8e 2012-11-08 6:34 PM

    いつもお世話になっております。
    8eと申します。
    このたび、RSSリーダーとしてこちらのタグを使わせていただいております。そこで、一つ質問させていただきたくコメントさせていただきました。
    記事の表示件数を定めるにはどうすればいいでしょうか。
    初歩的な質問で申し訳ありませんが、お応えいただければ幸いです。お忙しい中、大変お手数おかけいたしますが、宜しくお願い致します。

    Reply

    • saori 2012-11-08 9:12 PM

      8e 様

      初めまして。コメント&ブログを読んで頂いてありがとうございます。

      記事の表示件数を指定するには、この記事にあるコードの最初の行、
      $postslist = get_posts(‘numberposts=5&orderby=post_date&order=DESC’);
      ↑の numberposts=5 の部分の数字を表示させたい件数に変更します。その後の &orderby=post_date&order=DESC の部分では表示する順番を指定しています。このコードの場合は「投稿記事データの新しいものから5件表示」という指定になります。

      もし新しい記事を10件表示するなら、最初の行を下記のように記入すれば大丈夫だと思います。
      $postslist = get_posts(‘numberposts=10&orderby=post_date&order=DESC’);

      Reply

      • 8e 2012-11-09 11:12 AM

        saori 様

        迅速にご返信いただきありがとうございます。
        私のような初心者にも分かりやすく細かくご説明いただき大変嬉しい次第でございます。
        理解することができました、とても助かりました。

        今後ともこちらのサイトに通わせていただきたいと思っておりますので、よろしくお願い致します。
        陰ながら、ますますのご活躍楽しみにしております!

        Reply

        • saori 2012-11-09 5:47 PM

          8e 様

          こんばんは。そんな風にいって頂いてとても嬉しいです!!こちらこそありがとうございます。
          このブログが何かのお役にたてば幸いです(^-^)

          Reply

  • zen73 2012-12-06 11:56 AM

    はじめまして,zen73と申します。
    get_the_excerpt()の使い方がわからず困り果てていたところにこのサイトに出会うことができて嬉しく思っております。
    早速記事一覧を表示する固定ページにあなた様のコードを張り付けてみたところ,記事の抜粋は表示されたのですが,タイトルが記事のタイトルではなく固定ページのタイトルになってしまいます。
    どのような対処が必要でしょうか。
    あわせて,カテゴリ名の表示の仕方もお教えいただけますでしょうか。
    貴重なお時間を割かれますことを心苦しく思いますが,ご回答をお願いいたします。

    Reply

    • saori 2012-12-06 4:10 PM

      zen73様 

      初めまして。

      >タイトルが記事のタイトルではなく固定ページのタイトルになってしまいます。
      というのは、もしかしたらメインループの中にこのコードを書いているとかの可能性はないでしょうか?

      >カテゴリ名の表示の仕方もお教えいただけますでしょうか。
      カテゴリー名の取得は、< ?php the_category(' '); ?>で取得できます。
      詳しい使い方は、Codex(下記アドレスです)をご覧下さい。
      (テンプレートタグ/the category – WordPress Codex 日本語版)

      Reply

  • zen73 2012-12-06 7:00 PM

    こんなにも早くご回答をいただけるとは思ってもおりませんでした。ありがとうございます。

    >メインループの中にこのコードを書いているとかの可能性はないでしょうか?
    PHPは全くの超初心者でここがループの部分なんだろうなというような理解しかできておりません。
    そのため,ご提示いただいているコードを貼り付けただけです。

    リストA
    ■ 2012年12月4日 | リストA
    あああああああああああ …続きを読む
    ■ 2012年12月4日 | リストA aaaaaaaaaaaaaaaaaaaa …続きを読む
    というように,固定ページのタイトル「リストA」
    がタイトルとして表示されます。

    固定ページのテンプレートを使わずとも抜粋を表記できる,このすばらしいコードを使わせていただいて最終的には,
    [投稿記事のタイトル]
    [投稿日]|[カテゴリー名]
    としてみたいのですが,どのようにすると実現するのかご教授いただけないでしょうか。
    厚かましいお願いですが,よろしくお願いいたします。

    Reply

    • saori 2012-12-07 9:20 AM

      固定ページということはpage.phpにコードを書かれていると思いますが、
      だいたい以下のようなコードがあると思います。矢印で書いた所がメインループになるので、
      この中以外にコードを書いてみてはいかがですか?

      私が思いつくのはそのくらいでしょうか…
      WordPressのフォーラム→ http://ja.forums.wordpress.org/
      へ投稿してみるともっといろんなアドバイスが頂けるかもしれません。
      ==========================================

      <?php get_header(); ?>
      <?php get_sidebar(); ?>
      <div id="main">
      
      <?php if(have_posts()): ?>←ここから
      <?php while(have_posts()):the_post(); ?>			
      
      <?php the_content(); ?>  
      			
      <?php endwhile; ?>
      <?php else: ?>
      <?php endif; ?>←ここまでがメインループです。
      
      </div><!-- main -->
      <?php get_footer(); ?>
      

      Reply

  • zen73 2012-12-07 10:55 AM

    saori様

    いろいろと教えていただきまして,すべてがうまくいきました。ありがとうございました。

    saori様のこのブログに出会わなければ,サイトの構築を投げ出していたかもしれません。感謝申します。

    Reply

    • saori 2012-12-09 5:53 AM

      zen73 様
      解決したようでよかったです。
      ブログがお役にたって嬉しいです。

      Reply

Leave a Comment

Emailは公開されません。*は必須項目です。


*


Categorys

Tags

CSS3 ダッシュボード ヘッダー トラブル コードサンプル スライドショー コンテンツ 素材 jQueryプラグイン Facebook php 引っ越し お知らせ JavaScript CSS カテゴリー Shareボタン IE 投稿タイプ seo Photoshop HTML5 レスポンシブ サイドバー ナビゲーション タクソノミー WPセキュリティ Git カスタムメニュー Macアプリ PHPリファレンス SVG query_posts API WP使い方 iTunes データベース コメント function RSS 条件分岐 get_posts() スマートフォン Sass/Compass マルチサイト機能